diff --git a/demo/TypeScriptApp/package.json b/demo/TypeScriptApp/package.json index f98d9675..aabe8c7e 100644 --- a/demo/TypeScriptApp/package.json +++ b/demo/TypeScriptApp/package.json @@ -28,7 +28,7 @@ "mochawesome": "~3.1.2", "nativescript-dev-appium": "next", "nativescript-dev-webpack": "next", - "typescript": "~3.2.2", + "typescript": "~3.4.1", "node-sass": "^4.12.0" }, "scripts": { diff --git a/lib/before-checkForChanges.js b/lib/before-checkForChanges.js new file mode 100644 index 00000000..d456a1d3 --- /dev/null +++ b/lib/before-checkForChanges.js @@ -0,0 +1,16 @@ +module.exports = function ($staticConfig, hookArgs) { + const majorVersionMatch = ($staticConfig.version || '').match(/^(\d+)\./); + const majorVersion = majorVersionMatch && majorVersionMatch[1] && +majorVersionMatch[1]; + if (majorVersion && majorVersion < 6) { + // check if we are using the bundle workflow or the legacy one. + const isUsingBundleWorkflow = hookArgs && + hookArgs.checkForChangesOpts && + hookArgs.checkForChangesOpts.projectChangesOptions && + hookArgs.checkForChangesOpts.projectChangesOptions.bundle; + + if (isUsingBundleWorkflow) { + const packageJsonData = require("../package.json") + throw new Error(`The current version of ${packageJsonData.name} (${packageJsonData.version}) is not compatible with the used CLI: ${$staticConfig.version}. Please upgrade your NativeScript CLI version (npm i -g nativescript).`); + } + } +} \ No newline at end of file diff --git a/package.json b/package.json index 24e125e1..f5bce176 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,11 @@ "type": "after-prepare", "script": "lib/after-prepare.js", "inject": true + }, + { + "type": "before-checkForChanges", + "script": "lib/before-checkForChanges.js", + "inject": true } ] }, @@ -24,6 +29,7 @@ }, "scripts": { "postinstall": "node postinstall.js", + "preuninstall": "node preuninstall.js", "postpack": "rm -rf node_modules", "prepare": "tsc && npm run jasmine", "test": "npm run prepare && npm run jasmine", @@ -62,7 +68,7 @@ "terser-webpack-plugin": "1.2.3", "ts-loader": "^5.3.1", "webpack": "~4.27.0", - "webpack-bundle-analyzer": "~3.0.2", + "webpack-bundle-analyzer": "~3.3.2", "webpack-cli": "~3.1.1", "webpack-sources": "~1.3.0" }, diff --git a/plugins/WatchStateLoggerPlugin.ts b/plugins/WatchStateLoggerPlugin.ts index e10bca88..7e5302d7 100644 --- a/plugins/WatchStateLoggerPlugin.ts +++ b/plugins/WatchStateLoggerPlugin.ts @@ -33,51 +33,28 @@ export class WatchStateLoggerPlugin { .keys(compilation.assets) .filter(assetKey => compilation.assets[assetKey].emitted); - const webpackRuntimeFiles = getWebpackRuntimeOnlyFiles(compilation); - const entryPointFiles = getEntryPointFiles(compilation); + const chunkFiles = getChunkFiles(compilation); process.send && process.send(messages.compilationComplete, error => null); // Send emitted files so they can be LiveSynced if need be - process.send && process.send({ emittedFiles, webpackRuntimeFiles, entryPointFiles }, error => null); + process.send && process.send({ emittedFiles, chunkFiles }, error => null); }); } } -function getWebpackRuntimeOnlyFiles(compilation) { - let runtimeOnlyFiles = []; +function getChunkFiles(compilation) { + const chunkFiles = []; try { - runtimeOnlyFiles = [].concat(...Array.from(compilation.entrypoints.values()) - .map(entrypoint => entrypoint.runtimeChunk) - // filter embedded runtime chunks (e.g. part of bundle.js or inspector-modules.js) - .filter(runtimeChunk => !!runtimeChunk && runtimeChunk.preventIntegration) - .map(runtimeChunk => runtimeChunk.files)) - // get only the unique files in case of "single" runtime (e.g. runtime.js) - .filter((value, index, self) => self.indexOf(value) === index); - } catch (e) { - // breaking change in the Webpack API - console.log("Warning: Unable to find Webpack runtime files."); - } - - return runtimeOnlyFiles; -} - -function getEntryPointFiles(compilation) { - const entryPointFiles = []; - try { - Array.from(compilation.entrypoints.values()) - .forEach((entrypoint: any) => { - for (const entryChunk of entrypoint.chunks) { - entryChunk.files.forEach(fileName => { - if (fileName.indexOf("hot-update") === -1) { - entryPointFiles.push(fileName); - } - }); + compilation.chunks.forEach(chunk => { + chunk.files.forEach(file => { + if (file.indexOf("hot-update") === -1) { + chunkFiles.push(file); } }); + }); } catch (e) { - console.log("Warning: Unable to find Webpack entry point files."); + console.log("Warning: Unable to find chunk files."); } - return entryPointFiles - .filter((value, index, self) => self.indexOf(value) === index); // get only the unique files -} \ No newline at end of file + return chunkFiles; +} diff --git a/postinstall.js b/postinstall.js index 54d6b163..1956dcf5 100644 --- a/postinstall.js +++ b/postinstall.js @@ -1,16 +1,50 @@ "use strict"; -const { dirname } = require("path"); const hook = require("nativescript-hook")(__dirname); const { compareProjectFiles } = require("./projectFilesManager"); const { getProjectDir } = require("./projectHelpers"); +const path = require("path"); +const fs = require("fs"); const projectDir = getProjectDir(); +// This method is introduced as in version 1.0.0 of nativescript-dev-webpack (compatible and required for NativeScript 6.0.0) +// we have changed a lot of hooks and old ones are incompatible. This should be automatically handled with preuninstall script of the old version. +// However, old versions of nativescript-dev-webpack do not have such logic, so remove them manually on postinstall of the current version. +// This logic can be removed later, once most of the projects are migrated to 1.0.0 of the package or later. +// These new versions have preuninstall script that will automatically handle this case. +function removeOldHooks() { + const oldHooks = [ + "before-prepareJSApp", + "before-cleanApp", + "before-watch", + "after-watch", + "before-watchPatterns", + "before-shouldPrepare", + "after-prepare", + "before-preview-sync" + ]; + + const hooksDir = path.join(projectDir, "hooks"); + const pkgName = require("./package.json").name; + const filename = `${pkgName}.js`; + oldHooks.forEach(hookName => { + const hookPath = path.join(hooksDir, hookName, filename); + + try { + if (fs.existsSync(hookPath)) { + fs.unlinkSync(hookPath); + } + } catch (err) { + console.warn(`${pkgName} postinstall task: unable to delete hook ${hookPath}. Error is: ${err}`); + } + }); +} + if (projectDir) { compareProjectFiles(projectDir); - + removeOldHooks(); hook.postinstall(); const installer = require("./installer"); installer.install(); @@ -18,3 +52,4 @@ if (projectDir) { // We are installing dev dependencies for the nativescript-dev-webpack plugin. console.log("Skipping postinstall artifacts! We assumed the nativescript-dev-webpack is installing devDependencies"); } + diff --git a/preuninstall.js b/preuninstall.js new file mode 100644 index 00000000..8632200f --- /dev/null +++ b/preuninstall.js @@ -0,0 +1,11 @@ +"use strict"; + +const hook = require("nativescript-hook")(__dirname); + +const { getProjectDir } = require("./projectHelpers"); + +const projectDir = getProjectDir(); + +if (projectDir) { + hook.preuninstall(); +} diff --git a/templates/webpack.angular.js b/templates/webpack.angular.js index e94ffc0d..22b0b558 100644 --- a/templates/webpack.angular.js +++ b/templates/webpack.angular.js @@ -262,7 +262,7 @@ module.exports = env => { // Define useful constants like TNS_WEBPACK new webpack.DefinePlugin({ "global.TNS_WEBPACK": "true", - "process": undefined, + "process": "global.process", }), // Remove all files from the out dir. new CleanWebpackPlugin(itemsToClean, { verbose: !!verbose }), diff --git a/templates/webpack.javascript.js b/templates/webpack.javascript.js index c910a055..b976e827 100644 --- a/templates/webpack.javascript.js +++ b/templates/webpack.javascript.js @@ -213,7 +213,7 @@ module.exports = env => { // Define useful constants like TNS_WEBPACK new webpack.DefinePlugin({ "global.TNS_WEBPACK": "true", - "process": undefined, + "process": "global.process", }), // Remove all files from the out dir. new CleanWebpackPlugin(itemsToClean, { verbose: !!verbose }), diff --git a/templates/webpack.typescript.js b/templates/webpack.typescript.js index daf5a94b..b04e72e2 100644 --- a/templates/webpack.typescript.js +++ b/templates/webpack.typescript.js @@ -237,7 +237,7 @@ module.exports = env => { // Define useful constants like TNS_WEBPACK new webpack.DefinePlugin({ "global.TNS_WEBPACK": "true", - "process": undefined, + "process": "global.process", }), // Remove all files from the out dir. new CleanWebpackPlugin(itemsToClean, { verbose: !!verbose }), diff --git a/templates/webpack.vue.js b/templates/webpack.vue.js index 1d451d4c..600c399c 100644 --- a/templates/webpack.vue.js +++ b/templates/webpack.vue.js @@ -75,7 +75,7 @@ module.exports = env => { itemsToClean.push(`${join(projectRoot, "platforms", "android", "app", "src", "main", "assets", "snapshots")}`); itemsToClean.push(`${join(projectRoot, "platforms", "android", "app", "build", "configurations", "nativescript-android-snapshot")}`); } - + const config = { mode: mode, context: appFullPath, @@ -238,7 +238,8 @@ module.exports = env => { // Define useful constants like TNS_WEBPACK new webpack.DefinePlugin({ "global.TNS_WEBPACK": "true", - "TNS_ENV": JSON.stringify(mode) + "TNS_ENV": JSON.stringify(mode), + "process": "global.process" }), // Remove all files from the out dir. new CleanWebpackPlugin(itemsToClean, { verbose: !!verbose }), diff --git a/transformers/ns-replace-lazy-loader.spec.ts b/transformers/ns-replace-lazy-loader.spec.ts index b3628dfc..cdf49df6 100644 --- a/transformers/ns-replace-lazy-loader.spec.ts +++ b/transformers/ns-replace-lazy-loader.spec.ts @@ -43,6 +43,43 @@ describe("@ngtools/webpack transformers", () => { AppModule); export { AppModule };` }, + { + name: "should add providers and NgModuleFactoryLoader when providers is missing and decomposition is used", + rawAppModule: ` + import { NgModule } from "@angular/core"; + import { NativeScriptModule } from "nativescript-angular/nativescript.module"; + import { AppComponent } from "./app.component"; + + const declarationsArray = [AppComponent]; + @NgModule({ + bootstrap: [ + AppComponent + ], + imports: [ + NativeScriptModule + ], + declarations: [ + ...declarationsArray + ] + }) + export class AppModule { } + `, + transformedAppModule: ` + import * as tslib_1 from "tslib"; import { NgModule } from "@angular/core"; + import { NativeScriptModule } from "nativescript-angular/nativescript.module"; + import { AppComponent } from "./app.component"; + ${NgLazyLoaderCode} + const declarationsArray = [AppComponent]; + let AppModule = class AppModule { }; + AppModule = tslib_1.__decorate([ NgModule({ + bootstrap: [ AppComponent ], + imports: [ NativeScriptModule ], + declarations: [ ...declarationsArray ], + providers: [{ provide: nsNgCoreImport_Generated.NgModuleFactoryLoader, useClass: NSLazyModulesLoader_Generated }] }) + ], + AppModule); + export { AppModule };` + }, { name: "should add NgModuleFactoryLoader when the providers array is empty", rawAppModule: ` diff --git a/transformers/ns-replace-lazy-loader.ts b/transformers/ns-replace-lazy-loader.ts index 9823e801..99f9774f 100644 --- a/transformers/ns-replace-lazy-loader.ts +++ b/transformers/ns-replace-lazy-loader.ts @@ -93,7 +93,8 @@ export function addArrayPropertyValueToNgModule( // the target field is missing, we will insert it @NgModule({ otherProps }) const lastConfigObjPropertyNode = ngModuleConfigObjectNode.properties[ngModuleConfigObjectNode.properties.length - 1]; - const newTargetPropertyNode = ts.createIdentifier(`${targetPropertyName}: [${newPropertyValue}]`); + + const newTargetPropertyNode = ts.createPropertyAssignment(targetPropertyName, ts.createIdentifier(`[${newPropertyValue}]`)); return [ new AddNodeOperation(sourceFile, lastConfigObjPropertyNode, undefined, newTargetPropertyNode),