{"action":"created","issue":{"url":"https://api.github.com/repos/angular/angular/issues/24795","repository_url":"https://api.github.com/repos/angular/angular","labels_url":"https://api.github.com/repos/angular/angular/issues/24795/labels{/name}","comments_url":"https://api.github.com/repos/angular/angular/issues/24795/comments","events_url":"https://api.github.com/repos/angular/angular/issues/24795/events","html_url":"https://github.com/angular/angular/issues/24795","id":339291533,"node_id":"MDU6SXNzdWUzMzkyOTE1MzM=","number":24795,"title":"minifed code requires null check; @angular-devkit/build-angular requires process","user":{"login":"SamuelMarks","id":807580,"node_id":"MDQ6VXNlcjgwNzU4MA==","avatar_url":"https://avatars0.githubusercontent.com/u/807580?v=4","gravatar_id":"","url":"https://api.github.com/users/SamuelMarks","html_url":"https://github.com/SamuelMarks","followers_url":"https://api.github.com/users/SamuelMarks/followers","following_url":"https://api.github.com/users/SamuelMarks/following{/other_user}","gists_url":"https://api.github.com/users/SamuelMarks/gists{/gist_id}","starred_url":"https://api.github.com/users/SamuelMarks/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/SamuelMarks/subscriptions","organizations_url":"https://api.github.com/users/SamuelMarks/orgs","repos_url":"https://api.github.com/users/SamuelMarks/repos","events_url":"https://api.github.com/users/SamuelMarks/events{/privacy}","received_events_url":"https://api.github.com/users/SamuelMarks/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2018-07-09T03:14:08Z","updated_at":"2018-07-09T19:29:50Z","closed_at":null,"author_association":"NONE","body":"## I'm submitting a...\r\n<!-- Check one of the following options with \"x\" -->\r\n<pre><code>\r\n[ ] Regression (a behavior that used to work and stopped working in a new release)\r\n[X] Bug report  <!-- Please search GitHub for a similar issue or PR before submitting -->\r\n[ ] Performance issue\r\n[ ] Feature request\r\n[ ] Documentation issue or request\r\n[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question\r\n[ ] Other... Please describe:\r\n</code></pre>\r\n\r\n## Current behavior\r\nMy project compiles without error, using `ng build --prod`. However nothing loads. Checking the console, I get:\r\n```\r\nUncaught ReferenceError: process is not defined\r\n```\r\ntracing the minified code down, I came to this section:\r\n\r\n```\r\n    OekB: function(t, e, n) {\r\n        \"use strict\";\r\n        t.exports = \"win32\" === process.platform || !!process.env.COLORTERM || /^screen|^xterm|^vt100|color|ansi|cygwin|linux/i.test(process.env.TERM)\r\n    },\r\n```\r\n\r\nTracing that down in my directory tree, and I found:\r\n```\r\nnode_modules/@angular-devkit/build-optimizer/src/.cache/47e1a4b7ca8adc1aecb35ea3b98de6ab.json:{\"remainingRequest\":\"node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js??ref--8-1!node_modules/gauge/has-color.js\",\"dependencies\":[{\"path\":\"node_modules/gauge/has-color.js\",\"mtime\":1466042398000},{\"path\":\"node_modules/cache-loader/dist/cjs.js\",\"mtime\":1531103950607},{\"path\":\"node_modules/@angular-devkit/build-optimizer/src/build-optimizer/webpack-loader.js\",\"mtime\":1528256844000}],\"contextDependencies\":[],\"result\":[\"'use strict'\\n\\nmodule.exports = isWin32() || isColorTerm()\\n\\nfunction isWin32 () {\\n  return process.platform === 'win32'\\n}\\n\\nfunction isColorTerm () {\\n  var termHasColor = /^screen|^xterm|^vt100|color|ansi|cygwin|linux/i\\n  return !!process.env.COLORTERM || termHasColor.test(process.env.TERM)\\n}\\n\",null]}\r\n```\r\nTracing `gauge` to my `package-lock.json`, and only version 2.7.4 is used, running `grep` on that package shows that `has-color.js` is the culprit. Note that `gauge` is a dependency of `npmlog`, only 4.1.2 of `npmlog` is a dependency; and `node-pre-gyp`, `node-gyp`, `node-sass`, `npm-registry-client` and packages depend on `npmlog`. Some of these are dependencies of `@angular-devkit/build-angular`, so it's clearly an issue.\r\n\r\n\r\nAnyway, polyfilling `process`, or adding this to my `package.json`:\r\n```\r\n\"browser\": {\r\n    \"fs\": false,\r\n    \"path\": false,\r\n    \"os\": false\r\n  },\r\n```\r\n\r\nGives this error:\r\n```\r\nUncaught TypeError: e is not a constructor\r\n````\r\n\r\nThe prettified code is:\r\n```\r\nfunction Ao(t, e) {\r\n            var n;\r\n            switch (201347067 & e.flags) {\r\n            case 512:\r\n                n = function(t, e, n) {\r\n                    var i = n.length;\r\n                    switch (i) {\r\n                    case 0:\r\n                        return new e;\r\n```\r\n\r\nPrinting `e` to console, and I get:\r\n```\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){this.contexts=new Map} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ (){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ (){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ (){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ (){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ (){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ (){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ (){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ (){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ (){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: ƒ t(){} ;\r\nmain.685197d80b1a59a47a62.js:1 e: undefined ;\r\nmain.685197d80b1a59a47a62.js:1 Uncaught TypeError: e is not a constructor\r\n    at main.685197d80b1a59a47a62.js:1\r\n    at Ao (main.685197d80b1a59a47a62.js:1)\r\n    at main.685197d80b1a59a47a62.js:1\r\n    at new t (main.685197d80b1a59a47a62.js:1)\r\n    at Object.Qo [as createNgModuleRef] (main.685197d80b1a59a47a62.js:1)\r\n    at e.create (main.685197d80b1a59a47a62.js:1)\r\n    at main.685197d80b1a59a47a62.js:1\r\n    at e.invoke (polyfills.6a51f2ae3d3c5687da3a.js:1)\r\n    at Object.onInvoke (main.685197d80b1a59a47a62.js:1)\r\n    at e.invoke (polyfills.6a51f2ae3d3c5687da3a.js:1)\r\n(anonymous) @ main.685197d80b1a59a47a62.js:1\r\nAo @ main.685197d80b1a59a47a62.js:1\r\n(anonymous) @ main.685197d80b1a59a47a62.js:1\r\nt @ main.685197d80b1a59a47a62.js:1\r\nQo @ main.685197d80b1a59a47a62.js:1\r\ne.create @ main.685197d80b1a59a47a62.js:1\r\n(anonymous) @ main.685197d80b1a59a47a62.js:1\r\ne.invoke @ polyfills.6a51f2ae3d3c5687da3a.js:1\r\nonInvoke @ main.685197d80b1a59a47a62.js:1\r\ne.invoke @ polyfills.6a51f2ae3d3c5687da3a.js:1\r\nt.run @ polyfills.6a51f2ae3d3c5687da3a.js:1\r\nt.run @ main.685197d80b1a59a47a62.js:1\r\nt.bootstrapModuleFactory @ main.685197d80b1a59a47a62.js:1\r\nzUnb @ main.685197d80b1a59a47a62.js:1\r\ni @ runtime.4510d1eaa4782899e567.js:1\r\n6 @ main.685197d80b1a59a47a62.js:1\r\ni @ runtime.4510d1eaa4782899e567.js:1\r\nt @ runtime.4510d1eaa4782899e567.js:1\r\nr @ runtime.4510d1eaa4782899e567.js:1\r\n(anonymous) @ main.685197d80b1a59a47a62.js:1\r\n```\r\n\r\nIt compiles and runs when I change the line to:\r\n```\r\ncase 0:\r\n    return e == null? e : new e;\r\n```\r\n\r\nHowever, clicking a few things in my application, and I get this error:\r\n```\r\nERROR TypeError: i is not a constructor\r\n```\r\n\r\nWhich resolves to a different `return new i;`; which could probably be resolved with the same mechanism of null checking, but really I shouldn't have to patch the minified output.\r\n\r\n## Expected behavior\r\nIt should compile and serve without error.\r\n\r\n## Minimal reproduction of the problem with instructions\r\n```\r\ngit clone https://github.com/glaucoma-australia/glaucoma-risk-calculator-web-frontend\r\ncd glaucoma-risk-calculator-web-frontend\r\nnpm i -g @angular/cli typescript tslint typings\r\ntypings i\r\nnpm i\r\nng build --prod\r\ncd dist/glaucoma-risk-calculator-web-frontend\r\ncaddy # <or any other http server>\r\n# view in browser\r\n```\r\n\r\n## What is the motivation / use case for changing the behavior?\r\n<!-- Describe the motivation or the concrete use case. -->\r\n\r\n\r\n## Environment\r\n\r\n<pre><code>\r\nAngular version: 6.0.7\r\n\r\nBrowser:\r\n- [ ] Chrome (desktop) version XX\r\n- [ ] Chrome (Android) version XX\r\n- [ ] Chrome (iOS) version XX\r\n- [ ] Firefox version XX\r\n- [ ] Safari (desktop) version XX\r\n- [ ] Safari (iOS) version XX\r\n- [ ] IE version XX\r\n- [ ] Edge version XX\r\n \r\nFor Tooling issues:\r\n- Node version: 8.11.3\r\n- Platform:  Mac\r\n\r\nOthers:\r\n<!-- Anything else relevant?  Operating system version, IDE, package manager, HTTP server, ... -->\r\n</code></pre>\r\n"},"comment":{"url":"https://api.github.com/repos/angular/angular/issues/comments/403593731","html_url":"https://github.com/angular/angular/issues/24795#issuecomment-403593731","issue_url":"https://api.github.com/repos/angular/angular/issues/24795","id":403593731,"node_id":"MDEyOklzc3VlQ29tbWVudDQwMzU5MzczMQ==","user":{"login":"robwormald","id":534930,"node_id":"MDQ6VXNlcjUzNDkzMA==","avatar_url":"https://avatars1.githubusercontent.com/u/534930?v=4","gravatar_id":"","url":"https://api.github.com/users/robwormald","html_url":"https://github.com/robwormald","followers_url":"https://api.github.com/users/robwormald/followers","following_url":"https://api.github.com/users/robwormald/following{/other_user}","gists_url":"https://api.github.com/users/robwormald/gists{/gist_id}","starred_url":"https://api.github.com/users/robwormald/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/robwormald/subscriptions","organizations_url":"https://api.github.com/users/robwormald/orgs","repos_url":"https://api.github.com/users/robwormald/repos","events_url":"https://api.github.com/users/robwormald/events{/privacy}","received_events_url":"https://api.github.com/users/robwormald/received_events","type":"User","site_admin":false},"created_at":"2018-07-09T19:29:50Z","updated_at":"2018-07-09T19:29:50Z","author_association":"MEMBER","body":"As far as I'm aware, there's nothing in Angular framework code that uses or depends on the `process` module, anywhere (this would be a Bad Idea, as its a node-only API....). Build Optimizer may use it, but that's a purely build-time process and doesn't insert `process` into your code.\r\n\r\nIt's more likely that this is a third party dependency that uses process (or incorrectly includes it in a runtime bundle)\r\n\r\nWe'd need a reproduction of this to investigate further."}}
{"actor":{"display_login":"robwormald"}}