{"action":"created","issue":{"url":"https://api.github.com/repos/valor-software/ngx-bootstrap/issues/2972","repository_url":"https://api.github.com/repos/valor-software/ngx-bootstrap","labels_url":"https://api.github.com/repos/valor-software/ngx-bootstrap/issues/2972/labels{/name}","comments_url":"https://api.github.com/repos/valor-software/ngx-bootstrap/issues/2972/comments","events_url":"https://api.github.com/repos/valor-software/ngx-bootstrap/issues/2972/events","html_url":"https://github.com/valor-software/ngx-bootstrap/issues/2972","id":271005323,"number":2972,"title":"Angular AoT with SystemJS - \"Unexpected token import\"","user":{"login":"grichards23","id":7841032,"avatar_url":"https://avatars0.githubusercontent.com/u/7841032?v=4","gravatar_id":"","url":"https://api.github.com/users/grichards23","html_url":"https://github.com/grichards23","followers_url":"https://api.github.com/users/grichards23/followers","following_url":"https://api.github.com/users/grichards23/following{/other_user}","gists_url":"https://api.github.com/users/grichards23/gists{/gist_id}","starred_url":"https://api.github.com/users/grichards23/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/grichards23/subscriptions","organizations_url":"https://api.github.com/users/grichards23/orgs","repos_url":"https://api.github.com/users/grichards23/repos","events_url":"https://api.github.com/users/grichards23/events{/privacy}","received_events_url":"https://api.github.com/users/grichards23/received_events","type":"User","site_admin":false},"labels":[{"id":412532334,"url":"https://api.github.com/repos/valor-software/ngx-bootstrap/labels/comp(build)","name":"comp(build)","color":"0e8a16","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2017-11-03T14:52:52Z","updated_at":"2017-11-03T21:56:19Z","closed_at":null,"author_association":"NONE","body":"I've been tasked with retro-fitting a project from the beginning of this year to take advantage of Angular AoT. That project takes advantage of ngx-bootstrap's ModalModule and TooltipModule.\r\n\r\nThe owning project was written in VS2017/.Net Core with angular 4.\r\nWe use a gulp task to move project dependencies out to the **'wwwroot\\libs'** folder and load the modules from there.\r\n\r\nMy package.json (at least the pertinent parts...currently we're pinned at angular 4.4.4 for another reason)\r\n```\r\n\"dependencies\": {\r\n      \"@angular/animations\": \"4.4.4\",\r\n      \"@angular/common\": \"4.4.4\",\r\n      \"@angular/compiler\": \"4.4.4\",\r\n      \"@angular/compiler-cli\": \"4.4.4\",\r\n      \"@angular/core\": \"4.4.4\",\r\n      \"@angular/forms\": \"4.4.4\",\r\n      \"@angular/http\": \"4.4.4\",\r\n      \"@angular/platform-browser\": \"4.4.4\",\r\n      \"@angular/platform-browser-dynamic\": \"4.4.4\",\r\n      \"@angular/platform-server\": \"4.4.4\",\r\n      \"@angular/router\": \"4.4.4\",\r\n      \"@angular/upgrade\": \"4.4.4\",\r\n      \"bootstrap\": \"^3.3.7\",\r\n      ...\r\n      \"ngx-bootstrap\": \"^1.9.3\",\r\n      ...\r\n   }\r\n```\r\n\r\nMy systemjs.config.js looks like this:\r\n```javascript\r\nvar map = {\r\n   ...\r\n   'ngx-bootstrap': 'libs/ngx-bootstrap',\r\n   ...\r\n};\r\n   \r\nvar packages = {\r\n   ...\r\n   'ngx-bootstrap': { format: 'cjs', main: 'bundles/ngx-bootstrap.umd.min.js', defaultExtension: 'js' },\r\n};\r\n```\r\n\r\nMy app.module looks like this:\r\n```typescript\r\nimport { ModalModule, TooltipModule } from 'ngx-bootstrap';\r\n\r\n@NgModule({\r\n   imports: [\r\n      ...\r\n      ModalModule.forRoot(),\r\n      TooltipModule.forRoot()\r\n   ],\r\n   declarations: [\r\n      ...\r\n   ],\r\n   providers: [\r\n      ...\r\n   ],\r\n   bootstrap: [AppComponent]\r\n\r\n})\r\nexport class AppModule { }\r\n```\r\nAfter cleaning up the project's code to make it AoT \"friendly\", running it through the angular compiler which has \"wwwroot/aot\" specified as the \"genDir\".\r\n\r\nI change our boot.js file to bootstrap the resulting app module ngFactory.\r\n\r\n```typescript\r\nimport { platformBrowserDynamic } from '@angular/platform-browser-dynamic';\r\nimport { AppModuleNgFactory } from '../aot/wwwroot/app/app.module.ngfactory';\r\nimport 'rxjs/Rx';\r\n\r\nplatformBrowserDynamic().bootstrapModuleFactory(AppModuleNgFactory);\r\n```\r\n\r\nI see the following error:\r\n\r\n```\r\n(index):41 Error: Unexpected token import\r\n  Evaluating https://localhost:44360/libs/ngx-bootstrap/modal/modal-backdrop.component.js\r\n  Evaluating https://localhost:44360/aot/node_modules/ngx-bootstrap/modal/modal-backdrop.component.ngfactory.js\r\n  Evaluating https://localhost:44360/aot/wwwroot/app/app.module.ngfactory.js\r\n  Evaluating https://localhost:44360/app/boot-aot.js\r\n  Loading app/boot-aot\r\n    at eval (<anonymous>)\r\n    at evaluate (system.src.js:2818)\r\n    at system.src.js:3586\r\n    at dynamicExecute (system.src.js:1142)\r\n    at doEvaluate (system.src.js:1089)\r\n    at ensureEvaluate (system.src.js:997)\r\n    at system.src.js:1015\r\n    at Object.eval (modal-backdrop.component.ngfactory.ts:10)\r\n    at eval (modal-backdrop.component.ngfactory.ts:27)\r\n    at eval (modal-backdrop.component.ngfactory.ts:27)\r\n```\r\nAny help would be greatly appreciated.\r\nThanks for all that you do/provide.\r\n"},"comment":{"url":"https://api.github.com/repos/valor-software/ngx-bootstrap/issues/comments/341837084","html_url":"https://github.com/valor-software/ngx-bootstrap/issues/2972#issuecomment-341837084","issue_url":"https://api.github.com/repos/valor-software/ngx-bootstrap/issues/2972","id":341837084,"user":{"login":"BenevidesLecontes","id":1839361,"avatar_url":"https://avatars1.githubusercontent.com/u/1839361?v=4","gravatar_id":"","url":"https://api.github.com/users/BenevidesLecontes","html_url":"https://github.com/BenevidesLecontes","followers_url":"https://api.github.com/users/BenevidesLecontes/followers","following_url":"https://api.github.com/users/BenevidesLecontes/following{/other_user}","gists_url":"https://api.github.com/users/BenevidesLecontes/gists{/gist_id}","starred_url":"https://api.github.com/users/BenevidesLecontes/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/BenevidesLecontes/subscriptions","organizations_url":"https://api.github.com/users/BenevidesLecontes/orgs","repos_url":"https://api.github.com/users/BenevidesLecontes/repos","events_url":"https://api.github.com/users/BenevidesLecontes/events{/privacy}","received_events_url":"https://api.github.com/users/BenevidesLecontes/received_events","type":"User","site_admin":false},"created_at":"2017-11-03T21:56:19Z","updated_at":"2017-11-03T21:56:19Z","author_association":"NONE","body":"I'm having this too. i'm having this in almost every libs that are trying to support angular 5"}}
{"actor":{"display_login":"BenevidesLecontes"}}