npm警告：该包同时被列为开发和生产依赖项。

Question

当运行 npm install 命令时，我收到了以下警告：

npm WARN The package babel-core is included as both a dev and production dependency.
npm WARN The package babel-loader is included as both a dev and production dependency.
npm WARN The package babel-preset-react is included as both a dev and production dependency.
npm WARN The package redux-thunk is included as both a dev and production dependency.
npm WARN The package uglifyjs is included as both a dev and production dependency.

up to date in 7.183s
npm WARN The package babel-core is included as both a dev and production dependency.
npm WARN The package babel-loader is included as both a dev and production dependency.
npm WARN The package babel-preset-react is included as both a dev and production dependency.
npm WARN The package redux-thunk is included as both a dev and production dependency.
npm WARN The package uglifyjs is included as both a dev and production dependency.

package.json 文件:

{
 ...
  "dependencies": {
    "axios": "^0.15.3",
    "babel-core": "^6.10.4",
    "babel-loader": "^6.2.4",
    "babel-polyfill": "^6.9.1",
    "babel-preset-es2015": "^6.9.0",
    "babel-preset-react": "^6.11.1",
    "babel-preset-stage-2": "^6.24.1",
    "babel-register": "^6.9.0",
    "bluebird": "^3.5.0",
    "bootstrap-sass": "^3.3.7",
    "classnames": "^2.2.5",
    "console-polyfill": "^0.2.3",
    "cross-env": "^1.0.8",
    "css-loader": "^0.23.1",
    "deepmerge": "^1.3.2",
    "dom-helpers": "^3.0.0",
    "expect": "^1.20.1",
    "fuzzy": "^0.1.3",
    "moment": "^2.18.1",
    "node-libs-browser": "^1.0.0",
    "node-sass": "^3.8.0",
    "react": "^15.1.0",
    "react-addons-shallow-compare": "15.4.0",
    "react-addons-test-utils": "^15.1.0",
    "react-axios": "0.0.9",
    "react-bootstrap-daterangepicker": "^3.2.2",
    "react-daterange-picker": "^1.1.0",
    "react-dom": "^15.1.0",
    "react-draggable": "^2.2.3",
    "react-redux": "^4.4.8",
    "react-router": "^3.0.2",
    "react-virtualized": "^8.5.2",
    "redux": "^3.6.0",
    "redux-logger": "^2.6.1",
    "redux-promise": "^0.5.3",
    "redux-promise-middleware": "^4.2.0",
    "redux-thunk": "^2.1.0",
    "sass-loader": "^4.0.0",
    "style-loader": "^0.13.1",
    "uglifyjs": "=2.4.10",
    "webpack-dev-middleware": "^1.6.1",
    "webpack-dev-server": "^1.14.1",
    "webpack-hot-middleware": "^2.11.0"
  },
  "devDependencies": {
    "assets-webpack-plugin": "^3.5.1",
    "babel-core": "^6.24.1",
    "babel-loader": "^7.0.0",
    "babel-plugin-add-module-exports": "^0.2.1",
    "babel-plugin-react-transform": "^2.0.2",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-preset-es2016": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-3": "^6.24.1",
    "didyoumean": "^1.2.1",
    "extract-text-webpack-plugin": "^1.0.1",
    "glob": "^7.1.1",
    "postcss-loader": "^1.3.0",
    "purifycss-webpack-plugin": "^2.0.3",
    "react-transform-hmr": "^1.0.4",
    "redux-thunk": "^2.2.0",
    "uglifyjs": "=2.4.10",
    "webpack": "^1.15.0",
    "webpack-cleanup-plugin": "^0.5.1",
    "webpack-split-chunks": "^0.1.1"
  }
}

注意到已安装了不同版本的包。当在开发和生产环境中安装了相同包的两个版本时会发生什么？这是正常行为吗？我应该从package.json文件中删除重复引用吗？

- Philll_t

---

正如警告所提示的那样，你不应该这样做。你应该弄清楚你想要哪些版本。 - SLaks

它使用的是哪个版本？ - Philll_t

无论你最后安装哪一个。 - SLaks

所有这些模块（从babel，webpack开始）都是开发模块，请将它们从dependencies中移除。 - alexmac

Answer 1

你的依赖项在两个部分中都有引用；你绝对不应该这样做，因为这意味着你的生产安装将与你的开发安装版本不同。

如果你执行 npm install，你会得到所有的dependencies和devDependencies安装；然而，如果你执行 npm install --production，你只会安装dependencies。

你应该从dependencies中删除你不需要的东西来运行你的应用程序，并将它们放在devDependencies中。在dependencies中的东西应该被视为运行应用程序所需的要求（在任何代码转换之后）。

没有任何情况下一个依赖项应该存在于两者之间。

- whitfin

---

如果在开发中想要使用 file:...，但在生产环境中想要使用仓库或 git+ssh://... 来使用同一个库，该怎么办？npm似乎不支持这种情况，但我认为这是一个有效的用例。 - Jim Heising

Answer 2

我的用例与已接受答案评论中@Jim指出的情况完全相同。在开发中，我希望同时使用本地模块文件和其他项目使用它。

在生产中，我将使用来自版本控制系统的模块，而我不想每次手动更改package.json文件。

这是我设置package.json的方式：

"dependencies": {
  "module-name": "git+ssh://[e-mail]/XXX/XXX.git#master"
},
"devDependencies": {
  "module-name-dev": "file:../XXX"
}

通过这种设置，npm不会给我任何错误提示，因为模块名称不同，现在剩下的就是在开发中要求使用dev包而不是主包。

我找到了module-alias包，它允许您使用别名来引用所需的路径。

在您的app.js文件的最开始处，您需要添加以下代码：

if (process.env.NODE_ENV === 'development') {
  const moduleAlias = require('module-alias');

  moduleAlias.addAlias('module-name', 'module-name-dev');
}

从现在开始，每次您需要module-name模块时，您实际上会得到开发中的module-name-dev模块。

在生产环境中，您不应该安装devDependencies，并且别名将不起作用，因此无需额外步骤来在两者之间进行更改。

使用webpack

如果您正在使用webpack，则不需要module-alias，您可以像这样使用webpack-chain将别名添加到webpack配置中：

chainWebpack: (config) => {
    if (process.env.NODE_ENV === 'development') {
      config.resolve.alias
      .set('module-name', 'module-name-dev');
    }
  },

- Art3mix