大家好，又见面了，我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。
Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺
用vue来实验下, 目的是把webpack3升级至^4.0
更新思路是
先更新
看是否废弃掉了
yarn global add @vue/cli-init
vue init webpack hello_vue
cd hello_vue
npm start
需要先验证工程是正确的, 可以运行后去看下webpack版本
发现是3.6
npm install webpack@latest -D
npm install webpack-dev-server@latest -D
npm i webpack-cli@latest -D
npm i html-webpack-plugin@latest -D
npm i eslint-loader@latest -D
npm i vue-loader@latest -D
npm i css-loader@latest -D
npm i postcss-loader@latest -D
npm start
根据npm start 报错来修改升级
然后发现
再去写入配置文件
配置和完成后就ok了
再去配置mode
npm run build
打包看下有没有错
去官方文档把对应的代码加到配置和pro中去
optimization: {
splitChunks: {
chunks: ‘async’,
minSize: 30000,
maxSize: 0,
minChunks: 1,
maxAsyncRequests: 5,
maxInitialRequests: 3,
automaticNameDelimiter: ‘~’,
automaticNameMaxLength: 30,
name: true,
cacheGroups: {
vendors: {
test: /[\\/]node_modules[\\/]/,
priority: -10
},
default: {
minChunks: 2,
priority: -20,
reuseExistingChunk: true
}
}
}
}
注意有三个地方都要注释掉
然后发现报错:
Chunk.entrypoints: Use Chunks.groupsIterable and filter by instanceof Entrypoint instead
npm install extract-text-webpack-plugin@next -D
next代表还没正式发布的版本, 是在latest之后的
然后就是报错
Error: Path variable [contenthash] not implemented in this context: static/css/[name].[contenthash].css
这样就正式更新至webpack4完成
发布者：全栈程序员-用户IM，转载请注明出处：https://javaforall.cn/169202.html原文链接：https://javaforall.cn
【正版授权，激活自己账号】： Jetbrains全家桶Ide使用，1年售后保障，每天仅需1毛
【官方授权 正版激活】： 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...
