{"action":"created","issue":{"url":"https://api.github.com/repos/angular/angular-cli/issues/8880","repository_url":"https://api.github.com/repos/angular/angular-cli","labels_url":"https://api.github.com/repos/angular/angular-cli/issues/8880/labels{/name}","comments_url":"https://api.github.com/repos/angular/angular-cli/issues/8880/comments","events_url":"https://api.github.com/repos/angular/angular-cli/issues/8880/events","html_url":"https://github.com/angular/angular-cli/issues/8880","id":282163677,"number":8880,"title":"replaceBootstrap transformer fails when bootstrapModule() call is not chained with platformBrowserDynamic() call","user":{"login":"mcgraphix","id":1789874,"avatar_url":"https://avatars2.githubusercontent.com/u/1789874?v=4","gravatar_id":"","url":"https://api.github.com/users/mcgraphix","html_url":"https://github.com/mcgraphix","followers_url":"https://api.github.com/users/mcgraphix/followers","following_url":"https://api.github.com/users/mcgraphix/following{/other_user}","gists_url":"https://api.github.com/users/mcgraphix/gists{/gist_id}","starred_url":"https://api.github.com/users/mcgraphix/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mcgraphix/subscriptions","organizations_url":"https://api.github.com/users/mcgraphix/orgs","repos_url":"https://api.github.com/users/mcgraphix/repos","events_url":"https://api.github.com/users/mcgraphix/events{/privacy}","received_events_url":"https://api.github.com/users/mcgraphix/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2017-12-14T16:38:57Z","updated_at":"2017-12-14T22:15:09Z","closed_at":null,"author_association":"NONE","body":"<!--\r\nWe will close this issue if you don't provide the needed information.\r\nFor feature requests, delete the form below and describe the requirements and use case.\r\n-->\r\n\r\n### Versions\r\n```\r\nAngular CLI: 1.5.4 (e)\r\nNode: 6.11.3\r\nOS: darwin x64\r\nAngular: 5.1.0\r\n... animations, common, compiler, compiler-cli, core, forms\r\n... http, language-service, platform-browser\r\n... platform-browser-dynamic, router\r\n\r\n@angular/cli: 1.5.4\r\n@angular-devkit/build-optimizer: 0.0.35\r\n@angular-devkit/core: 0.0.22\r\n@angular-devkit/schematics: 0.0.41\r\n@ngtools/json-schema: 1.1.0\r\n@ngtools/webpack: 1.8.4\r\n@schematics/angular: 0.1.10\r\n@schematics/schematics: 0.0.10\r\ntypescript: 2.4.2\r\nwebpack-concat-plugin: 1.4.0\r\nwebpack-dev-server: 2.9.7\r\nwebpack: 3.8.1\r\n```\r\n\r\n### Repro steps\r\n<!--\r\nSimple steps to reproduce this bug.\r\nPlease include: commands run, packages added, related code changes.\r\nA link to a sample repo would help too.\r\n-->\r\n* Create a new project with: ng new project-name\r\n* Run using: ng serve --prod\r\n* Open browser and it runs as expected\r\n* Change main.ts to split the call to platformBrowserDynamic() from the call to bootstrapModule()\r\n````\r\nconst platform = platformBrowserDynamic();\r\nplatform.bootstrapModule(AppModule)\r\n  .catch(err => console.log(err));\r\n````\r\n* Run: ng serve --prod\r\n* Open browser and see error in console:\r\n```Error: No NgModule metadata found for 'function (){}'.```\r\n\r\n\r\n### Observed behavior\r\nComplete stack trace:\r\n```\r\nmain.9d791305398abba6bf45.bundle.js:1 Uncaught Error: No NgModule metadata found for 'function (){}'.\r\n    at e.resolve (main.9d791305398abba6bf45.bundle.js:1)\r\n    at e.getNgModuleMetadata (main.9d791305398abba6bf45.bundle.js:1)\r\n    at e._loadModules (main.9d791305398abba6bf45.bundle.js:1)\r\n    at e._compileModuleAndComponents (main.9d791305398abba6bf45.bundle.js:1)\r\n    at e.compileModuleAsync (main.9d791305398abba6bf45.bundle.js:1)\r\n    at e.compileModuleAsync (main.9d791305398abba6bf45.bundle.js:1)\r\n    at e.LMZF.e.bootstrapModule (main.9d791305398abba6bf45.bundle.js:1)\r\n    at Object.cDNt (main.9d791305398abba6bf45.bundle.js:1)\r\n    at n (inline.687454df27f852918dab.bundle.js:1)\r\n    at Object.0 (main.9d791305398abba6bf45.bundle.js:1)\r\n```\r\n\r\n### Desired behavior\r\nIt should work identically as when the calls are chained.\r\n\r\n\r\n### Mention any other details that might be useful (optional)\r\nThe reason for making this change to split into two lines is that in my case, in the handler for the promise returned from bootstrapModule() I need to do some initialization and I need access to the platfor. Calling platformBrowserDynamic() seems to return a different platform if you call it a second time so I need the one used to call bootstrapModule on:\r\n````\r\n// this is unique to my portal environment\r\ndeclare var wrapper: any;\r\n\r\nconst platform = platformBrowserDynamic();\r\nplatform.bootstrapModule(AppModule)\r\n  .then((ref: NgModuleRef<AppModule>) => {\r\n    // setup required for my portal environment\r\n    wrapper.setApplicationComponentNode(ref, platform);\r\n  })\r\n  .catch(err => console.log(err));\r\n````\r\n\r\nThe only workaround at the moment for this is to create a separate main-prod.ts file, eject the webpack config and then modify it to use a different main file for prod vs. dev build.\r\n"},"comment":{"url":"https://api.github.com/repos/angular/angular-cli/issues/comments/351852637","html_url":"https://github.com/angular/angular-cli/issues/8880#issuecomment-351852637","issue_url":"https://api.github.com/repos/angular/angular-cli/issues/8880","id":351852637,"user":{"login":"mcgraphix","id":1789874,"avatar_url":"https://avatars2.githubusercontent.com/u/1789874?v=4","gravatar_id":"","url":"https://api.github.com/users/mcgraphix","html_url":"https://github.com/mcgraphix","followers_url":"https://api.github.com/users/mcgraphix/followers","following_url":"https://api.github.com/users/mcgraphix/following{/other_user}","gists_url":"https://api.github.com/users/mcgraphix/gists{/gist_id}","starred_url":"https://api.github.com/users/mcgraphix/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mcgraphix/subscriptions","organizations_url":"https://api.github.com/users/mcgraphix/orgs","repos_url":"https://api.github.com/users/mcgraphix/repos","events_url":"https://api.github.com/users/mcgraphix/events{/privacy}","received_events_url":"https://api.github.com/users/mcgraphix/received_events","type":"User","site_admin":false},"created_at":"2017-12-14T22:15:09Z","updated_at":"2017-12-14T22:15:09Z","author_association":"NONE","body":"I found a workaround for this by using:\r\n````\r\nplatformBrowserDynamic().bootstrapModule(AppModule)\r\n  .then((ref: NgModuleRef<AppModule>) => {\r\n    // setup required for my portal environment\r\n    const platform: PlatformRef = ref.injector.get(PlatformRef);\r\n    wrapper.setApplicationComponentNode(ref, platform);\r\n  })\r\n  .catch(err => console.log(err));\r\n````\r\nHowever, a better error message or a comment in the generated main.ts would at least be an improvement."}}
{"actor":{"display_login":"mcgraphix"}}