Webpack自定义插件来定义模块

时间:2017-03-10 14:27:40

标签: node.js webpack modernizr webpack-2

我正在尝试为Webpack编写一个小的自定义插件,它将构建一个自定义的Modernizr对象并将其公开。我找到了this pluginthis loader,但加载程序似乎很糟糕(即使我直接传递选项也需要空文件.modernizrrc),而插件只能创建一个单独的文件。

我从前面提到的插件中借用了一些代码,但无法弄清楚最后一步(如何在构建的文件中公开Modernizr):

const modernizr = require('modernizr'),
  ConcatSource = require('webpack-sources/lib/ConcatSource'),
  CachedSource = require('webpack-sources/lib/CachedSource');

class BuildModernizrPlugin {
  constructor(props = {}) {
    let plugin = this;
    plugin._props = props;
  }

  apply(compiler) {
    let plugin = this;

    compiler.plugin('after-compile', (compiler, callback) => {
      modernizr.build(plugin._props, result => {
        plugin._modernizr = result;
        callback();
      });
    });

    compiler.plugin('emit', (compilation, callback) => {
      let source = new ConcatSource();
      source.add(plugin._modernizr);
      compilation.assets['modernizr.js'] = new CachedSource(source);
      callback();
    });
  }
}

webpack config

{
  //...
  plugins: [
    new BuildModernizrPlugin({
      options: [
        'setClasses'
      ],
      'feature-detects': [
        'es6/promises'
      ]
    })
  ]
}

但是它似乎创建了一个单独的modernizr.js文件,而我想将Modernizr代码嵌入到我的输出文件中。非常感谢任何帮助。

0 个答案:

没有答案