From ba68a1b2784b31ac276b5161e6f44cb6a844665a Mon Sep 17 00:00:00 2001 From: Stanimira Vlaeva Date: Wed, 20 Jun 2018 13:05:08 +0300 Subject: [PATCH] feat: make webpack deps production deps of the plugin (#571) implements #569 BREAKING CHANGES: The dependencies that were previously added by the nativescript-dev-webpack plugin to the project's package.json are now dependencies of the plugin itself. MIGRATION: 1. Remove all obsolete dependencies from your project. You can do that by invoking the script: ``` ./node_modules/.bin/update-ns-webpack --deps ``` 2. [Angular] Add the following packages as devDependencies: ``` //package.json "devDependencies": { "@angular-devkit/build-angular": "~0.7.0-rc.0", "@angular/compiler-cli": "~6.1.0-beta.1", //... } ``` --- demo/AngularApp/package.json | 18 +-------- demo/JavaScriptApp/package.json | 15 +------ demo/TypeScriptApp/package.json | 16 +------- dependencyManager.js | 71 +++++++++++++++++---------------- package.json | 19 ++++++++- projectHelpers.js | 14 ------- 6 files changed, 57 insertions(+), 96 deletions(-) diff --git a/demo/AngularApp/package.json b/demo/AngularApp/package.json index 317d60ed..27f97bbe 100644 --- a/demo/AngularApp/package.json +++ b/demo/AngularApp/package.json @@ -29,9 +29,8 @@ "zone.js": "^0.8.4" }, "devDependencies": { - "@angular-devkit/core": "~0.7.0-beta.1", + "@angular-devkit/build-angular": "~0.7.0-beta.1", "@angular/compiler-cli": "~6.0.0", - "@ngtools/webpack": "~6.1.0-beta.1", "@types/chai": "^4.0.2", "@types/mocha": "^2.2.41", "@types/node": "^7.0.5", @@ -40,10 +39,6 @@ "babylon": "6.18.0", "chai": "~4.1.1", "chai-as-promised": "~7.1.1", - "clean-webpack-plugin": "~0.1.19", - "copy-webpack-plugin": "~4.5.1", - "css-loader": "~0.28.11", - "extract-text-webpack-plugin": "~3.0.2", "lazy": "1.0.11", "mocha": "~3.5.0", "mocha-junit-reporter": "^1.13.0", @@ -52,16 +47,7 @@ "nativescript-dev-sass": "^1.3.5", "nativescript-dev-typescript": "next", "nativescript-dev-webpack": "file:../..", - "nativescript-worker-loader": "~0.9.0", - "raw-loader": "~0.5.1", - "resolve-url-loader": "~2.3.0", - "sass-loader": "~7.0.1", - "typescript": "~2.7.2", - "uglifyjs-webpack-plugin": "~1.2.5", - "webpack": "~4.6.0", - "webpack-bundle-analyzer": "~2.13.0", - "webpack-cli": "~2.1.3", - "webpack-sources": "~1.1.0" + "typescript": "~2.7.2" }, "scripts": { "ns-bundle": "ns-bundle", diff --git a/demo/JavaScriptApp/package.json b/demo/JavaScriptApp/package.json index c22d08a2..a492ee07 100644 --- a/demo/JavaScriptApp/package.json +++ b/demo/JavaScriptApp/package.json @@ -23,10 +23,6 @@ "babel-traverse": "6.26.0", "babel-types": "6.26.0", "babylon": "6.18.0", - "clean-webpack-plugin": "~0.1.19", - "copy-webpack-plugin": "~4.5.1", - "css-loader": "~0.28.7", - "extract-text-webpack-plugin": "~3.0.2", "lazy": "1.0.11", "mocha": "~3.5.0", "mocha-junit-reporter": "^1.13.0", @@ -34,16 +30,7 @@ "nativescript-dev-appium": "next", "nativescript-dev-sass": "^1.3.5", "nativescript-dev-webpack": "file:../..", - "nativescript-worker-loader": "~0.8.1", - "node-sass": "^4.7.1", - "raw-loader": "~0.5.1", - "resolve-url-loader": "~2.3.0", - "sass-loader": "~6.0.6", - "uglifyjs-webpack-plugin": "~1.2.4", - "webpack": "~4.5.0", - "webpack-bundle-analyzer": "^2.9.1", - "webpack-cli": "~2.0.14", - "webpack-sources": "~1.1.0" + "node-sass": "^4.7.1" }, "scripts": { "ns-bundle": "ns-bundle", diff --git a/demo/TypeScriptApp/package.json b/demo/TypeScriptApp/package.json index 9521e498..3cef17fa 100644 --- a/demo/TypeScriptApp/package.json +++ b/demo/TypeScriptApp/package.json @@ -20,14 +20,9 @@ "@types/chai": "^4.0.2", "@types/mocha": "^2.2.41", "@types/node": "^7.0.5", - "awesome-typescript-loader": "~5.0.0-1", "babel-traverse": "6.26.0", "babel-types": "6.26.0", "babylon": "6.18.0", - "clean-webpack-plugin": "~0.1.19", - "copy-webpack-plugin": "~4.5.1", - "css-loader": "~0.28.7", - "extract-text-webpack-plugin": "~3.0.2", "lazy": "1.0.11", "mocha": "~3.5.0", "mocha-junit-reporter": "^1.13.0", @@ -36,16 +31,7 @@ "nativescript-dev-sass": "^1.3.5", "nativescript-dev-typescript": "next", "nativescript-dev-webpack": "file:../..", - "nativescript-worker-loader": "~0.8.1", - "raw-loader": "~0.5.1", - "resolve-url-loader": "~2.3.0", - "sass-loader": "~6.0.6", - "typescript": "~2.7.2", - "uglifyjs-webpack-plugin": "~1.2.4", - "webpack": "~4.5.0", - "webpack-bundle-analyzer": "^2.9.1", - "webpack-cli": "~2.0.14", - "webpack-sources": "~1.1.0" + "typescript": "~2.7.2" }, "scripts": { "ns-bundle": "ns-bundle", diff --git a/dependencyManager.js b/dependencyManager.js index eb15c164..510be021 100644 --- a/dependencyManager.js +++ b/dependencyManager.js @@ -1,4 +1,4 @@ -const { isAngular, isTypeScript, isSass } = require("./projectHelpers"); +const { isAngular } = require("./projectHelpers"); const NEW_DEPS_MESSAGE = `\ A few new dependencies were added. \ @@ -21,10 +21,6 @@ You can also pass the "--env.uglify" flag to use UglifyJS for minification. For more information check out https://docs.nativescript.org/tooling/bundling-with-webpack#bundling. `; -function forceUpdateProjectDeps(packageJson) { - return addProjectDeps(packageJson, true); -} - function addProjectDeps(packageJson, force = false) { packageJson.devDependencies = packageJson.devDependencies || {}; const postinstallOptions = { @@ -41,6 +37,35 @@ function addProjectDeps(packageJson, force = false) { return postinstallOptions; } +function forceUpdateProjectDeps(packageJson) { + removeObsoleteDeps(packageJson); + + return addProjectDeps(packageJson, true); +} + +function removeObsoleteDeps(packageJson) { + const depsToRemove = [ + "webpack", + "webpack-cli", + "webpack-bundle-analyzer", + "webpack-sources", + "clean-webpack-plugin", + "copy-webpack-plugin", + "raw-loader", + "css-loader", + "nativescript-worker-loader", + "extract-text-webpack-plugin", + "uglifyjs-webpack-plugin", + "@ngtools/webpack", + "@angular-devkit/core", + "resolve-url-loader", + "awesome-typescript-loader", + "sass-loader", + ]; + + depsToRemove.forEach(dep => delete packageJson.devDependencies[dep]); +} + function addDependency(deps, name, version, force) { const options = { deps }; @@ -57,36 +82,12 @@ function addDependency(deps, name, version, force) { } function getRequiredDeps(packageJson) { - const deps = { - "webpack": "~4.6.0", - "webpack-cli": "~2.1.3", - "webpack-bundle-analyzer": "~2.13.0", - "webpack-sources": "~1.1.0", - "clean-webpack-plugin": "~0.1.19", - "copy-webpack-plugin": "~4.5.1", - "raw-loader": "~0.5.1", - "css-loader": "~0.28.11", - "nativescript-worker-loader": "~0.9.0", - "extract-text-webpack-plugin": "~3.0.2", - "uglifyjs-webpack-plugin": "~1.2.5", - }; - - if (isAngular({packageJson})) { - Object.assign(deps, { - "@angular/compiler-cli": packageJson.dependencies["@angular/core"], - "@ngtools/webpack": "~6.1.0-beta.1", - "@angular-devkit/core": "~0.7.0-beta.1", - "resolve-url-loader": "~2.3.0", - }); - } else if (isTypeScript({packageJson})) { - Object.assign(deps, { "awesome-typescript-loader": "~5.0.0" }); - } - - if (isSass({packageJson})) { - Object.assign(deps, { "sass-loader": "~7.0.1" }); - } - - return deps; + return isAngular({packageJson}) ? + { + "@angular-devkit/build-angular": "~0.7.0-rc.0", + "@angular/compiler-cli": "~6.1.0-beta.1", + } : + { }; } function showHelperMessages({ newDepsAdded, hasOldDeps }) { diff --git a/package.json b/package.json index 1721be26..7d31731a 100644 --- a/package.json +++ b/package.json @@ -74,10 +74,25 @@ "schema-utils": "0.4.3", "semver": "5.4.1", "shelljs": "0.6.0", - "tapable": "1.0.0" + "tapable": "1.0.0", + "webpack": "~4.6.0", + "webpack-cli": "~2.1.3", + "webpack-bundle-analyzer": "~2.13.0", + "webpack-sources": "~1.1.0", + "clean-webpack-plugin": "~0.1.19", + "copy-webpack-plugin": "~4.5.1", + "raw-loader": "~0.5.1", + "css-loader": "~0.28.11", + "nativescript-worker-loader": "~0.9.0", + "extract-text-webpack-plugin": "~3.0.2", + "uglifyjs-webpack-plugin": "~1.2.5", + "@angular-devkit/core": "^0.7.0-rc.0", + "resolve-url-loader": "~2.3.0", + "awesome-typescript-loader": "~5.0.0", + "sass-loader": "~7.0.1" }, "devDependencies": { - "@angular-devkit/core": "^0.7.0-beta.1", + "@angular-devkit/core": "^0.7.0-rc.0", "@types/node": "^8.0.0", "conventional-changelog-cli": "^1.3.22", "rxjs": "^6.2.0", diff --git a/projectHelpers.js b/projectHelpers.js index 67108138..77fed89e 100644 --- a/projectHelpers.js +++ b/projectHelpers.js @@ -28,19 +28,6 @@ const isAngular = ({ projectDir, packageJson } = {}) => { .some(dependency => /^@angular\b/.test(dependency)); }; -const isSass = ({ projectDir, packageJson } = {}) => { - packageJson = packageJson || getPackageJson(projectDir); - const SASS_PLUGIN_NAME = "nativescript-dev-sass"; - - return ( - packageJson.dependencies && - packageJson.dependencies.hasOwnProperty(SASS_PLUGIN_NAME) - ) || ( - packageJson.devDependencies && - packageJson.devDependencies.hasOwnProperty(SASS_PLUGIN_NAME) - ); -}; - const getWebpackConfig = (projectDir, env, configPath = "webpack.config.js") => { const configAbsolutePath = resolve(projectDir, configPath); let config; @@ -112,7 +99,6 @@ module.exports = { isAndroid, isIos, isAngular, - isSass, isTypeScript, writePackageJson, };