Webpack加载程序订单行为不端

Question

我用过webpack ^ 2.2.1.我在webpack.config.js文件中添加了一些加载器.

但我的装载机没有打电话给订单.

我使用babel-loader将react-es6代码转换为react-es5代码.我的自定义加载器需要react-es6代码.所以我把我的装载机放在第一位.我在每个加载器中都有打印源内容.但每次首次打印babel-loader信息.打印完我的信息后.

我的装载机订单是否正确？

帮我!提前致谢!

   // webpack.config.js

    module.exports = {
      entry: './src/index.js',
      output: {
         filename: 'bundle.js',
         path: path.resolve(__dirname, './build')
      }
      module: {
         loaders: [
            {
                test: /\.js$/,
                use: 'my-custom-loader'
            },
            {
                test: /\.js$/,
                use: [
                   {
                      loader: 'babel-loader',
                      options: {
                         presets: ['babel-preset-es2015', 'babel-preset-react']
                      }
                   }
                ]
            }
         ]
      }
    }

Answer 1

Webpack中的加载器按"从右到左"的顺序使用,因此首先使用数组中的最后一个加载器.因此,巴贝尔正在翻译所有东西,而你的装载机排在第二位.

请参阅:webpack的加载程序顺序是什么？

尝试切换你的加载器的顺序(当然使用module.rules而不是module.loaders,这样你就可以在Webpack 2中使用新的Pattern)