Question

我试图将我的代码从webpack v1迁移到v2并添加到sass-loader中，但是我收到了错误

throw new WebpackOptionsValidationError(webpackOptionsValidationErrors);

我对最终文件的外观非常困惑：

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


module.exports = {
    devtool: 'eval-source-map',
  entry: [
    './src/index'
  ],
  module: {

   rules: [
       {
           test: /\.scss$/,
           use: [
               "style-loader", // creates style nodes from JS strings
               "css-loader", // translates CSS into CommonJS
               "sass-loader" // compiles Sass to CSS
           ]
       }],

      test: /\.js?$/,
      loader: 'babel-loader',
      exclude: /node_modules/


 },

  resolve: {
    extensions: ['.js'],
      options: {
          enforceExtension: false
      }
  },

  output: {
    path: path.join(__dirname, '/dist'),
    publicPath: '/',
    filename: 'bundle.js'
  },

  devServer: {
    contentBase: './dist',
    hot: true,
      historyApiFallback: true
  },

  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin(),
      new webpack.LoaderOptionsPlugin({
          debug: true,
               options: {
           context: __dirname
         }
   })
  ]
};

目前代码是两个版本的混合。我使用的是webpack 2.2.1版。感谢。

Answer 1

您需要更改几件事：

您的test: /\.js?$/以及相应的loader和exclude应该是rules数组中的另一个对象：

module: {
  rules: [
    {
      test: /\.scss$/,
      use: [
        "style-loader", // creates style nodes from JS strings
        "css-loader", // translates CSS into CommonJS
        "sass-loader" // compiles Sass to CSS
      ]
    },
    {
      test: /\.js?$/,
      loader: 'babel-loader',
      exclude: /node_modules/
    }
  ]
},

resolve.options不存在，直接只有resolve.enforceExtension：

resolve: {
  extensions: ['.js'],
  enforceExtension: false
},

最后，虽然这不是错误，只是警告，new webpack.NoErrorsPlugin()已被弃用，并已替换为：

new webpack.NoEmitOnErrorsPlugin()

此外，如果您还没有，请查看官方文档https://webpack.js.org/guides/migrating/中的迁移指南。

从webpack v1迁移到v2

1 个答案: