参考https://webpack.js.org/guides/caching/#deterministic-hashes

var path = require("path");
var webpack = require("webpack");
var ChunkManifestPlugin = require("chunk-manifest-webpack-plugin");
var WebpackChunkHash = require("webpack-chunk-hash"); module.exports = {
entry: {
vendor: "./src/vendor.js", // vendor reference file(s)
main: "./src/index.js" // application code
},
output: {
path: path.join(__dirname, "build"),
filename: "[name].[chunkhash].js",
chunkFilename: "[name].[chunkhash].js"
},
plugins: [
new webpack.optimize.CommonsChunkPlugin({
name: ["vendor", "manifest"], // vendor libs + extracted manifest
minChunks: Infinity,
}),
new webpack.HashedModuleIdsPlugin(),
new WebpackChunkHash(),
new ChunkManifestPlugin({
filename: "chunk-manifest.json",
manifestVariable: "webpackManifest",
inlineManifest: true
})
]
};

CommonsChunkPlugin相关的更多相关文章

  1. webpack3 项目升级 webpack4

    由于 vue-cli 2 构建的项目是基于 webpack3,所以只能自己动手改动,至于升级 webpack4之后提升的编译速度以及各种插件自己去体验. 修改配置 1.替换插件 extract-tex ...

  2. 嵌入式单片机STM32应用技术(课本)

    目录SAIU R20 1 6 第1页第1 章. 初识STM32..................................................................... ...

  3. webpack CommonsChunkPlugin详细教程

    1.demo结构: 2.package.json配置: { "name": "webpack-simple-demo", "version" ...

  4. CommonsChunkPlugin的使用(关于angular2中的polyfills和vendor的疑问解决)

    seed: angular2-webpack-starter(在github上可以找到) polyfills:提供api以方便兼容不同的浏览器 vendor:项目插件扩展 在学习ng2中一直不明白为什 ...

  5. CommonsChunkPlugin的一些总结

    CommonsChunkPlugin 官方文档地址 https://webpack.github.io/docs/list-of-plugins.html#commonschunkplugin new ...

  6. vue-cli脚手架npm相关文件解读(2)webpack.prod.conf.js

    系列文章传送门: 1.build/webpack.base.conf.js 2.build/webpack.prod.conf.js 3.build/webpack.dev.conf.js 4.bui ...

  7. 谈谈CommonsChunkPlugin抽取公共模块

    引言 webpack插件CommonsChunkPlugin的主要作用是抽取webpack项目入口chunk的公共部分,具体的用法就不做过多介绍,不太了解可以参考webpack官网介绍: 该插件是we ...

  8. webpack优化相关操作

    1.缩小文件搜索的范围 • 优化loader配置 尽量精确使用 include 只命中需要的文件.    module.exports = {      module: {        rules: ...

  9. CommonsChunkPlugin

    CommonsChunk 插件的作用就是提取代码中的公共代码,然后将公共模块打包到一个独立的文件中,以便在其它的入口和模块中使用,原理就是把多个入口共同的依赖都给定义成一个新入口 多种打包情况: 单一 ...

随机推荐

  1. Windows10+Docker搭建分布式Redis集群(SSH服务镜像)(二)

    前言:上篇文章我们搭建好了Docker,下面我们开始使用Docker创建镜像,Docker命令就不介绍了.这里宿主是Windows10,cmd的管理和后期文件的复制不是很方便,将创建支持SSH的Cen ...

  2. vue.js初识(一)

    一 什么是vue? Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层,不 ...

  3. 关于if后面直接加上参数名,不加条件的用法

    <template> <section> <p v-if="aa">{{aa}}</p> <p v-if="bb&q ...

  4. elasticsearch启动常见错误

    问题出现环境,OS版本:CentOS-7-x86_64-Minimal-1708:ES版本:elasticsearch-6.2.2. 1.max file descriptors [4096] for ...

  5. 学习React系列(五)——使性能最优

    提高性能可分为两方面: 一.配置层面 二.代码层面 本文只从代码层面考虑: 一.避免重复渲染 这里要说一句: 当shouldComponentUpdate返回false的时候不触发render函数也就 ...

  6. 关于div包裹img,底下多出3px间隙的问题

    背景:昨天写过一个div包裹图片的html,已经reset了所有的div,但还是发现img与div底部会有3px的间距,我检查了所有的css,发现并未发现什么问题,结果度娘了一下,发现好多朋友都遇到了 ...

  7. C# 传统四舍五入保留两位小数(网上流传好多错误的版本)

    关于C#里面的Math.Round,很多人都会用到,而且以为是四舍五入,其实不是这样的: C#里面的Math.Round是符合IEEE标准的“四舍五入”,其实是五舍六入. 网上好多流传的下面这种方式实 ...

  8. Python系列之 - python数据类型

    原链接:https://blog.csdn.net/m0_37745438/article/details/79572884 学习一门语言,往往都是从Hello World开始. 但是笔者认为,在一个 ...

  9. Shiro加密

    在开发的时候,很多数据我们都希望是以加密过后的形式存储起来,而不是最原始的数据. 在shiro中也提供了编码,解码,加密,加密算法实现等等一系列的内容. 编码/解码 在org.apache.shiro ...

  10. ●BZOJ 1416 [NOI2006]神奇的口袋

    题链: http://www.lydsy.com/JudgeOnline/problem.php?id=1416题解: Pòlya瓦罐模型: 给定罐子里每种颜色的球的个数A[i],按题目要求随机操作若 ...