diff --git a/demo/AngularApp/app/item/item-detail.component.ts b/demo/AngularApp/app/item/item-detail.component.ts index a9d6c6fa..9183f787 100644 --- a/demo/AngularApp/app/item/item-detail.component.ts +++ b/demo/AngularApp/app/item/item-detail.component.ts @@ -6,7 +6,7 @@ import { ItemService } from "./item.service"; @Component({ selector: "ns-details", - moduleId: __filename, + moduleId: module.id, templateUrl: "./item-detail.component.html", }) export class ItemDetailComponent implements OnInit { diff --git a/demo/AngularApp/app/item/items.component.ts b/demo/AngularApp/app/item/items.component.ts index 9dac97ba..e81ae0a7 100644 --- a/demo/AngularApp/app/item/items.component.ts +++ b/demo/AngularApp/app/item/items.component.ts @@ -5,7 +5,7 @@ import { ItemService } from "./item.service"; @Component({ selector: "ns-items", - moduleId: __filename, + moduleId: module.id, styleUrls: ["./items.component.scss"], templateUrl: "./items.component.html", }) @@ -19,4 +19,4 @@ export class ItemsComponent implements OnInit { ngOnInit(): void { this.items = this.itemService.getItems(); } -} \ No newline at end of file +} diff --git a/moduleid-compat-loader.js b/moduleid-compat-loader.js new file mode 100644 index 00000000..ec8ec963 --- /dev/null +++ b/moduleid-compat-loader.js @@ -0,0 +1,16 @@ +/** + * When building NativeScript angular apps without webpack (`tns run android`) the moduleId: module.id is necessary. + * When building with webpack the angular compiler and webpack handle relative paths in the modules and no longer need moduleId + * to be set, however webpack emits numbers for module.id and angular has typecheck for moduleId to be a string. + */ +module.exports = function (source, map) { + this.cacheable(); + + // Strips occurences of `moduleId: module.id,`, since it is no longer needed for webpack builds + const noModuleIdsSource = source.replace(/moduleId\:\s*module\.id\s*(\,)?/g, result => + // Try to preserve char count so sourcemaps may remain intact + "/*" + result.substring(2, result.length - 2) + "*/" + ); + + this.callback(null, noModuleIdsSource, map); +}; \ No newline at end of file diff --git a/templates/webpack.angular.js b/templates/webpack.angular.js index ae429b18..cd711b91 100644 --- a/templates/webpack.angular.js +++ b/templates/webpack.angular.js @@ -66,7 +66,7 @@ module.exports = env => { // SASS support { test: /\.scss$/, use: ["raw-loader", "resolve-url-loader", "sass-loader"] }, // Compile TypeScript files with ahead-of-time compiler. - { test: /.ts$/, loader: "@ngtools/webpack" }, + { test: /.ts$/, use: ["nativescript-dev-webpack/moduleid-compat-loader", "@ngtools/webpack"] }, ], }, plugins: [