webpack用了manifest为何还是每次都生成新的vendor?

webpack打包时,不是说用manifest的话,就能使提取出来的代码以后不再需要生成吗?现在的情况是:

每次webpack后,还是会生成新的vendor.xx.js啊。。

我想每次修改完自己的代码,webpack后只更新自己写的那个js,第三方的不会再生成多次。

下面是webpack.config.js

var webpack = require('webpack');
var path = require('path');
var HtmlwebpackPlugin = require('html-webpack-plugin');
var ROOT_PATH = path.resolve(__dirname);
var APP_PATH = path.resolve(ROOT_PATH, 'app');
var BUILD_PATH = path.resolve(ROOT_PATH, 'build');
var CleanWebpackPlugin = require('clean-webpack-plugin');
    
module.exports = {
  entry:{
    main: APP_PATH,
    vendor: ['jquery']
  },
  output:{
    path: BUILD_PATH,
    filename: '[name].[hash:5].js'
  },

  devServer:{
    historyApiFallback: true,
    inline: true
  },

  module: {
    loaders: [
      {
        test: /\.css$/,
        loaders: ['style-loader', 'css-loader'],
        include: APP_PATH
      },
      {
        test: /\.(png|jpg)$/,
        loader: 'url-loader?limit=40000'
      },
      {
        test: /\.jsx?$/,
        loader: 'babel-loader',
        include: APP_PATH,
        query: {
          presets: ['es2015']
        }
      }
    ]
  },
  
  plugins: [
    new HtmlwebpackPlugin({
      title: 'Hello World app'
    }),
    //用于提取公共代码
    new webpack.optimize.CommonsChunkPlugin({ //记得要在开头引入webpack
      names: ['vendor','manifest'] //用于提取vendor
    }),
    new CleanWebpackPlugin(
        ['build/main.*.js','build/manifest.*.js'],//要删除的文件目录匹配
        {
            root:__dirname,
            verbose:true,
            dry:false
        }
    ),
  ]
};
阅读 6.6k
2 个回答

正好今天刚了解过CommonsChunkPlugin这个插件,回答一下你的问题:
因为vendor和manifest需要用到不同的definition或minChunks,所以需要调用他两次,而你只调用了一次
请看webpack官网示例截图:

clipboard.png

本人实验过后确认执行成功

页面地址:https://webpack.js.org/plugin...

CommonsChunkPlugin用这个插件的话 就会遇到你这样的问题,因为每次编译的时候 hash是变化的,所以一直在变。
建议用这个插件DllPlugin,附上一篇教程https://github.com/chenchunyo...

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进