reactjs - Webpack(v 3.0.0)开发模式下的 validateSchema 错误

Question

昨天我安装了 webpack-cli，它与 react 和其他包配合得很好，今天我只想再次设置我的 webpack 配置文件，但是当我运行webpack-dev-server 通过 npm 它只是吐出这个错误:

K:\web\07_Webpack_Test\node_modules\webpack-cli\bin\convert-argv.js:7
const validateSchema = process.webpackModule.validateSchema;
                                             ^

TypeError: Cannot read property 'validateSchema' of undefined
    at Object.<anonymous> (K:\web\07_Webpack_Test\node_modules\webpack-cli\bin\convert-argv.js:7:46)
    at Module._compile (internal/modules/cjs/loader.js:678:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:689:10)
    at Module.load (internal/modules/cjs/loader.js:589:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:528:12)
    at Function.Module._load (internal/modules/cjs/loader.js:520:3)
    at Module.require (internal/modules/cjs/loader.js:626:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at Object.<anonymous> (K:\web\07_Webpack_Test\node_modules\webpack-dev-server\bin\webpack-dev-server.js:234:15)
    at Module._compile (internal/modules/cjs/loader.js:678:30)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! 07_webpack_test@1.0.0 dev: `webpack-dev-server -d`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the 07_webpack_test@1.0.0 dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Eric PC\AppData\Roaming\npm-cache\_logs\2018-06-02T07_12_22_842Z-debug.log

这是我运行它的命令:

 "scripts": {
    "dev": "webpack-dev-server -d",
    "build": "npm run clear && webpack -p",
    "clear": "rimraf ./public/*"
  },

这是我的 webpack.config.js:

var path = require('path');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');


module.exports = {

  entry: {
    app: './src/js/app.jsx',
  },

  output: {
    path: path.resolve(__dirname , 'public'),
    filename: '[name].bundle.js'
  },

  module: {

    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        use: 'babel-loader'
      },
      {
        test: /\.scss$/,
        use : ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: ['css-loader' , 'sass-loader'],
          publicPath: "/public"
        })
      }
    ]

  },


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


  plugins: [

    new HtmlWebpackPlugin({
      title: 'React App',
      filename: 'index.html',
      template: './src/index.html'
    }),

    new ExtractTextPlugin({
      filename: 'app.css',
      disable: false,
      allChunks: true
    })

  ],


  devServer: {
    contentBase: '/public',
    compress: true,
    port: 3000,
    open: true,
    historyApiFallback: true,
    stats: 'errors-only'
  }

}

在与该错误作斗争之后，我终于发现 webpack-cli 发生了版本更改，昨天我安装了 webpack-cli 2.1.4，今天我安装了 webpack-cli 2.1.4安装版本3.0.0。我通过检查 npm 网站上的版本发现了这一点，发现发布 webpack-cli version 3 仅仅过了 5 个小时:

我应该注意，当我运行 npm run build 时，它只是构建文件夹并且一切正常，但我无法在开发模式下运行并在浏览器中查看结果。

我知道如果我将 webpack cli 降级到以前的版本它一定可以工作，但问题是，这个错误是什么以及如何解决它？ (由于 Node 包更新频繁，所以有必要保持最新，对吧？)

Answer 1

新版本的webpack-cli将webpack添加到全局进程对象中。这会导致 webpack-dev-derver 等应用程序崩溃，因为它假定 process.webpackModule 在当前进程中可用。

我也创建了一个拉取请求来解决这个问题 https://github.com/webpack/webpack-cli/pull/478