Incompatibility with 'autodll-webpack-plugin'

[huixisheng]

webpack.config.js

    plugins.push(new AutoDllPlugin({
      inject: true,
      filename: '[name]_[hash:8].js',
      debug: true,
      path: './dll',
      entry: {
        vendor: [
          'vue-router',
          'vuex',
          'nprogress',
        ],
      },
    }));

[vzaidman]

I would like to fix it. Does anybody can provide me with any help with it?

[dalaoque]

Webpack config plugins list order with speed-measure-webpack-plugin

It used concat()

The source code is as follows

speed-measure-webpack-plugin/index.js

Line 64 in 2405267

config.plugins = config.plugins.concat(this);

SpeedMeasurePlugin was after DllReferencePlugin or AutoDllPlugin and at the bottom on the plugins list.

const SpeedMeasurePlugin = require("speed-measure-webpack-plugin");

const smp = new SpeedMeasurePlugin();

const webpackConfig = smp.wrap({
  plugins: [
    new MyPlugin(),
    new MyOtherPlugin()
  ]
});

console.log('webpackConfig: ', webpackConfig)

webpackConfig:

{
  ...,
  plugins: [
    DefinePlugin { definitions: [Object] },
    HtmlWebpackPlugin {
      options: [Object],
      childCompilerHash: undefined,
      assetJson: undefined,
      hash: undefined,
      version: 4
    },
    MiniCssExtractPlugin { options: [Object] },
    CopyPlugin { patterns: [Array], options: {} },
    DllReferencePlugin { options: [Object] },
    AddAssetHtmlPlugin { assets: [Array], addedAssets: [] },
    SpeedMeasurePlugin {
      options: {},
      timeEventData: {},
      smpPluginAdded: true,
      wrap: [Function: bound wrap],
      getOutput: [Function: bound getOutput],
      addTimeEvent: [Function: bound addTimeEvent],
      apply: [Function: bound apply],
      provideLoaderTiming: [Function: bound provideLoaderTiming]
    }
  ]
  }
}

So, Put the SpeedMeasurePlugin in front of the DllReferencePlugin or AutoDllPlugin.

1. Not used wrap

const SpeedMeasurePlugin = require("speed-measure-webpack-plugin");

const webpackConfig = {
  plugins: [
    new SpeedMeasurePlugin(),

    new MyPlugin(),
    new MyOtherPlugin(),
    ...
  ]
})

2. Change sequence

const SpeedMeasurePlugin = require("speed-measure-webpack-plugin");

const smp = new SpeedMeasurePlugin();

const smpWrapConfig = smp.wrap({
  plugins: []
});
const webpackConfig = {
  entry: {
    app: './src/index.js',
  },
  output: {},
  plugins: [
    new MyPlugin(),
    new MyOtherPlugin()
  ]
}
webpackConfig.unshift(...smpWrapConfig.plugins)

module.exports = webpackConfig

3. It's up to the author. ^_^