Question

我有一个Rails应用程序，它在前端包含许多反应组件，最近在尝试添加其他东西时因为多个版本的反应而开始破坏。

回过头来更新旧代码，以便所有代码都可以在react@15.x上。我决定使用peerDependencies，这样每个功能都不会加载到自己的反应库实例中。

在开发中peerDependencies工作正常，但在尝试构建生产时，我收到错误：

Cannot resolve module 'react' in /Users/path/to/project/lib/toaster @ ...

我错过了什么？

的package.json：

{
  "name": "my-package",
  // ... omitted ...
  "scripts": {
    "test": "NODE_ENV=development testem ci",
    "testem": "testem -g",
    "start": "webpack --watch",
    "build": "webpack -p --config ./webpack.production.config.js --progress --profile --colors --preserve-symlinks"
  },
  "repository": { // ... omitted ... },
  "devDependencies": {
    "babel-core": "^6.4.5",
    "babel-loader": "^6.2.1",
    "babel-preset-es2015": "^6.3.13",
    "babel-preset-react": "^6.23.0",
    "browser-sync": "^2.17.2",
    "browser-sync-webpack-plugin": "^1.1.3",
    "bundle-collapser": "^1.1.1",
    "del": "^1.1.1",
    "envify": "^3.2.0",
    "es6-promise": "^2.0.1",
    "tape": "^4.0.0",
    "testem": "^0.6.35",
    "webpack": "^1.13.2"
  },
  "peerDependencies": {
    "react": "^15.3.2",
    "react-dom": "^15.3.2"
  },
  "dependencies": {
    "empty": "^0.10.0",
    "lodash": "^3.9.1",
    "react-addons-css-transition-group": "^15.4.2"
  }
}

webpack.production.config.js

var path = require('path');
var webpack = require('webpack');

module.exports = {
  entry: [
    ...
  ],
  devtool: 'eval',
  output: {
    path: path.join(__dirname, "output"),
    filename: 'index.js',
    library: 'my-package',
    libraryTarget: 'umd'
  },
  resolveLoader: {
    modules: ['..', 'node_modules']
  },
  plugins: [
    new webpack.DefinePlugin({
      // This has effect on the react lib size.
      "process.env": {
        NODE_ENV: JSON.stringify("production")
      }
    }),
    new webpack.IgnorePlugin(/vertx/),
    new webpack.IgnorePlugin(/configs/),
    new webpack.IgnorePlugin(/un~$/),
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.UglifyJsPlugin(),
  ],
  resolve: {
    extensions: ['.js', '.jsx']
  },
  module: {
    loaders: [
      {
        test: /.jsx?$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        query: {
          presets: ['es2015', 'react']
        }
      }
    ]
  }
};

Answer 1

我明白了......

这与peerDependencies无关。问题发生在resolve

下的 webpack.production.config.js 文件中

resolve: {
  extensions: ['.js', '.jsx']
}

需要

resolve: {
  extensions: ['', '.js', '.jsx']
}

它在我正常的 webpack.config.js 文件中

无法找到webpack 1 build peerDependencies

1 个答案: