node.js - Webpack 构建错误

Question

更新 TL;DR感谢@sinan-bolel 我现在知道命令了

npm ls --depth=0

准确显示当前已安装 npm 包。这让我半途而废。现在区分工作和不工作的 node_modules。

原始问题

我如何更新我的 package.json 以反射(reflect)我项目中所有本地安装的包而不是 package.json 中的内容？

好的，所以 webpack 没有提示就停止了构建。这发生在名为 PC_A 的桌面上。

PC_B 有一个工作设置，从 Visual Studio Code(使用 powershell)运行。当 PC_A 站点被破坏时，我的 react 是，啊，容易。只需从 PC_A 删除源并从 SVN 更新。这恢复了捆绑错误之前的文件，应该很容易恢复和运行。

只需运行 npm install 重新安装所有 node_modules(它们不在 SVN 中)就可以了，对吧？没有。

使用 npm install 重新安装后，Webpack 仍然生成相同的构建错误。 (据我所知，它读取 package.json 并按指定安装包)运行 npm run build 会产生以下错误:

node_modules\extract-text-webpack-plugin\schema\validator.js:11
            throw new Error(ajv.errorsText());
    ^
Error: data['sourceMap'] should NOT have additional properties

奇怪的解决方法:我压缩了整个 node_modules 映射并将其传输到 PC_A 并正确放置。现在 webpack 构建得很好。所以我认为 PC_B 上的 node_modules 中一定有一些东西可以解决这个问题，这就是我想更新我的 package.json 的原因。但是我不想使用 npm upgrade --save(-dev) 因为这会将本地包和 package.json 更新为最新版本。我想用本地版本填充 package.json。

我尝试过的:

npm upgrade --save & npm upgrade --save-dev
npm shrinkwrap ( looks promising but doesnt update package.json )
manual updating, tedious and not really scaleable )
npm ls --depth=0 ( works perfect, showing all installed packages! Now to find the culprit )

'Not working node_modules' npm ls --depth=0 产生:

aurelia-skeleton-navigation-webpack@1.0.2 C:\brokenapp
+-- @easy-webpack/config-aurelia@2.2.4
+-- @easy-webpack/config-babel@2.0.4
+-- @easy-webpack/config-common-chunks-simple@2.0.3
+-- @easy-webpack/config-copy-files@1.1.2
+-- @easy-webpack/config-css@2.5.0
+-- @easy-webpack/config-env-development@2.1.6
+-- @easy-webpack/config-env-production@2.2.4
+-- @easy-webpack/config-external-source-maps@2.0.2
+-- @easy-webpack/config-fonts-and-images@1.2.2
+-- @easy-webpack/config-generate-index-html@2.1.1
+-- @easy-webpack/config-global-bluebird@1.3.3
+-- @easy-webpack/config-global-jquery@1.4.1
+-- @easy-webpack/config-global-regenerator@1.3.0
+-- @easy-webpack/config-html@2.0.3
+-- @easy-webpack/config-json@2.0.3
+-- @easy-webpack/config-source-map-support@1.0.2
+-- @easy-webpack/config-test-coverage-istanbul@2.0.3
+-- @easy-webpack/config-typescript@2.1.4
+-- @easy-webpack/config-uglify@2.2.3
+-- @easy-webpack/core@1.4.5
+-- @types/bluebird@2.0.31
+-- @types/d3@4.4.0
+-- @types/jasmine@2.5.43
+-- @types/leaflet@1.0.41
+-- @types/turf@3.5.32
+-- @types/whatwg-fetch@0.0.27
+-- aurelia-bootstrapper-webpack@1.0.0
+-- aurelia-dialog@1.0.0-beta.3.0.1
+-- aurelia-event-aggregator@1.0.0
+-- aurelia-fetch-client@1.0.1
+-- aurelia-framework@1.0.7
+-- aurelia-history-browser@1.0.0
+-- aurelia-loader-webpack@1.0.3
+-- aurelia-logging-console@1.0.0
+-- aurelia-pal-browser@1.0.0
+-- aurelia-polyfills@1.1.1
+-- aurelia-route-recognizer@1.1.0
+-- aurelia-router@1.0.7
+-- aurelia-templating-binding@1.0.0
+-- aurelia-templating-resources@1.1.1
+-- aurelia-templating-router@1.0.0
+-- aurelia-tools@0.2.4
+-- babel-plugin-transform-decorators-legacy@1.3.4
+-- babel-preset-es2015@6.22.0
+-- babel-preset-es2015-loose@7.0.0
+-- babel-preset-es2015-loose-native-modules@1.0.0
+-- babel-preset-stage-1@6.22.0
+-- babel-register@6.23.0
+-- bluebird@3.4.6
+-- bootstrap@3.3.7
+-- concurrently@2.2.0
+-- cross-env@2.0.1
+-- d3@4.3.0
+-- d3-tile@0.0.3
+-- font-awesome@4.7.0
+-- http-server@0.9.0
+-- isomorphic-fetch@2.2.1
+-- jasmine-core@2.5.2
+-- jquery@3.1.1
+-- karma@1.5.0
+-- karma-chrome-launcher@1.0.1
+-- karma-coverage@1.1.1
+-- karma-jasmine@1.1.0
+-- karma-mocha-reporter@2.2.2
+-- karma-remap-istanbul@0.1.1
+-- karma-sourcemap-loader@0.3.7
+-- karma-webpack@1.8.1
+-- leaflet@1.0.1
+-- lodash@4.16.6
+-- moment@2.15.2
+-- protractor@4.0.14
+-- rimraf@2.6.1
+-- topojson@2.2.0
+-- ts-node@1.7.3
+-- turf@3.0.14
+-- typescript@2.1.1
+-- wait-on@1.5.4
+-- UNMET PEER DEPENDENCY webpack@2.1.0-beta.22
`-- webpack-dev-server@2.4.1

npm ERR! peer dep missing: webpack@^2.2.0, required by webpack-dev-server@2.4.1
npm ERR! peer dep missing: webpack@^2.2.0, required by extract-text-webpack-plugin@2.0.0

'Working node_modules' npm ls --depth=0 产生:

aurelia-skeleton-navigation-webpack@1.0.2 C:\app
+-- @easy-webpack/config-aurelia@2.2.3
+-- @easy-webpack/config-babel@2.0.4
+-- @easy-webpack/config-common-chunks-simple@2.0.3
+-- @easy-webpack/config-copy-files@1.1.2
+-- @easy-webpack/config-css@2.5.0
+-- @easy-webpack/config-env-development@2.1.6
+-- @easy-webpack/config-env-production@2.2.4
+-- @easy-webpack/config-external-source-maps@2.0.2
+-- @easy-webpack/config-fonts-and-images@1.2.2
+-- @easy-webpack/config-generate-index-html@2.1.1
+-- @easy-webpack/config-global-bluebird@1.3.3
+-- @easy-webpack/config-global-jquery@1.4.1
+-- @easy-webpack/config-global-regenerator@1.3.0
+-- @easy-webpack/config-html@2.0.3
+-- @easy-webpack/config-json@2.0.3
+-- @easy-webpack/config-source-map-support@1.0.2
+-- @easy-webpack/config-test-coverage-istanbul@2.0.3
+-- @easy-webpack/config-typescript@2.1.4
+-- @easy-webpack/config-uglify@2.2.3
+-- @easy-webpack/core@1.4.5
+-- @types/bluebird@2.0.31
+-- @types/d3@4.4.0
+-- @types/jasmine@2.5.41
+-- @types/leaflet@1.0.41
+-- @types/turf@3.5.32
+-- @types/whatwg-fetch@0.0.27
+-- aurelia-bootstrapper-webpack@1.0.0
+-- aurelia-dialog@1.0.0-beta.3.0.1
+-- aurelia-event-aggregator@1.0.0
+-- aurelia-fetch-client@1.0.1
+-- aurelia-framework@1.0.7
+-- aurelia-history-browser@1.0.0
+-- aurelia-loader-webpack@1.0.3
+-- aurelia-logging-console@1.0.0
+-- aurelia-pal-browser@1.0.0
+-- aurelia-polyfills@1.1.1
+-- aurelia-route-recognizer@1.1.0
+-- aurelia-router@1.0.7
+-- aurelia-templating-binding@1.0.0
+-- aurelia-templating-resources@1.1.1
+-- aurelia-templating-router@1.0.0
+-- aurelia-tools@0.2.4
+-- babel-plugin-transform-decorators-legacy@1.3.4
+-- babel-preset-es2015@6.22.0
+-- babel-preset-es2015-loose@7.0.0
+-- babel-preset-es2015-loose-native-modules@1.0.0
+-- babel-preset-stage-1@6.22.0
+-- babel-register@6.22.0
+-- bluebird@3.4.6
+-- bootstrap@3.3.7
+-- concurrently@2.2.0
+-- cross-env@2.0.1
+-- d3@4.3.0
+-- d3-tile@0.0.3
+-- font-awesome@4.7.0
+-- http-server@0.9.0
+-- isomorphic-fetch@2.2.1
+-- jasmine-core@2.5.2
+-- jquery@3.1.1
+-- karma@1.4.0
+-- karma-chrome-launcher@1.0.1
+-- karma-coverage@1.1.1
+-- karma-jasmine@1.1.0
+-- karma-mocha-reporter@2.2.2
+-- karma-remap-istanbul@0.1.1
+-- karma-sourcemap-loader@0.3.7
+-- karma-webpack@1.8.1
+-- leaflet@1.0.1
+-- lodash@4.16.6
+-- moment@2.15.2
+-- protractor@4.0.14
+-- rimraf@2.5.4
+-- topojson@2.2.0
+-- ts-node@1.7.3
+-- turf@3.0.14
+-- typescript@2.1.1
+-- wait-on@1.5.4
+-- UNMET PEER DEPENDENCY webpack@2.1.0-beta.22
`-- webpack-dev-server@2.2.0

npm ERR! peer dep missing: webpack@^2.2.0, required by webpack-dev-server@2.2.0
npm ERR! extraneous: moment@2.15.1 C:\app\node_modules\wait-on\node_modules\moment

那么我如何区分不工作和工作来定位导致错误的包？

Answer 1

您可以使用 npm ls --depth=0 列出项目已安装的包。

在 PC_A 和 PC_B 上运行它，然后将两台机器上列出的软件包版本与 package.json 中指定的版本进行比较。这将使您能够发现任何差异。

您还可以通过从 package.json 依赖项中的版本号中删除 ^、>= 等来将包锁定到确切的版本，以确保在package.json 文件是已安装的文件。

引用semver有关版本控制标准的更多信息的文档。