使用 Webpack Encore 添加自定义加载器和插件

编辑此页

添加自定义加载器

Encore 已经自带了各种不同的加载器，但是如果有一些目前不支持的特定加载器你想使用，你可以通过 addLoader 函数来添加你自己的加载器。addLoader 接受任何有效的 webpack rules 配置。

例如，如果你想添加 handlebars-loader，使用你的加载器配置调用 addLoader

        1
2
3
4
        Encore
    // ...
    .addLoader({ test: /\.handlebars$/, loader: 'handlebars-loader' })
;
    

由于加载器配置接受任何有效的 Webpack rules 对象，你可以传递你需要的任何额外信息给加载器

        1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
        Encore
    // ...
    .addLoader({
        test: /\.handlebars$/,
        loader: 'handlebars-loader',
        options: {
            helperDirs: [
                __dirname + '/helpers1',
                __dirname + '/helpers2',
            ],
            partialDirs: [
                path.join(__dirname, 'templates', 'partials')
            ]
        }
    })
;
    

添加自定义插件

Encore 在内部使用各种不同的插件。但是，你可以通过 addPlugin() 方法添加你自己的插件。例如，如果你使用 Moment.js，你可能想使用 IgnorePlugin（参见 moment/moment#2373）

        1
2
3
4
5
6
7
8
9
10
11
        // webpack.config.js
+ var webpack = require('webpack');

  Encore
      // ...

+     .addPlugin(new webpack.IgnorePlugin({
+         resourceRegExp: /^\.\/locale$/,
+         contextRegExp: /moment$/,
+     }))
  ;
    

本作品，包括代码示例，根据 Creative Commons BY-SA 3.0 许可协议获得许可。

版本