speed-measure-webpack-plugin icon indicating copy to clipboard operation
speed-measure-webpack-plugin copied to clipboard

Incompatibility with 'autodll-webpack-plugin'

Open huixisheng opened this issue 6 years ago • 2 comments

image

webpack.config.js

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

huixisheng avatar Mar 01 '19 14:03 huixisheng

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

vzaidman avatar Apr 14 '19 09:04 vzaidman

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

It used concat()

The source code is as follows

https://github.com/stephencookdev/speed-measure-webpack-plugin/blob/24052675160ceaf42f53d06e3da538ecf04e9e81/index.js#L64

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(),
    ...
  ]
})
  1. 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
  1. It's up to the author. ^_^

dalaoque avatar Aug 21 '20 12:08 dalaoque