Webpack
文章平均质量分 82
GHkmmm
cv工程师
展开
-
Webpack to Vite,项目实战踩坑记录
随着公司各个项目体积的增大,开发环境项目的构建常常能达到一分钟甚至更长,使用vite能快速帮助我们提升项目的构建速度,于是最近开始对公司的项目进行改造,同时为了节省时间成本,生产的环境的构建打算沿用原本webpack的那套配置,仅仅将开发环境由webpack转为vite。一、安装vite相关依赖"vite": "^2.7.13","vite-plugin-html": "^2.1.2","vite-plugin-vue2": "^1.9.3",二、修改index.html的位置将index.原创 2022-02-09 15:51:38 · 2570 阅读 · 2 评论 -
Webpack配置详解
Webpack相关文章Webpack的基本使用Webpack的性能优化entry1.string类型单入口打包形成一个chunk输出一个bundle文件。此时chunk的默认名称是mainmodule.exports = { entry: './src/index.js', ...}2.array类型多入口所有入口文件最终只会形成-一个chunk,输出出去只有一个bundle文件只有在HMR功能中让html热更新生效module.exports = {原创 2020-08-03 10:59:45 · 244 阅读 · 0 评论 -
Webpack的性能优化
HMRhot module replacement 热模块替换/模块热替换作用:一个模块发生变化,只会重新打包这一个模块(而不是打包所有模块) 极大提升构建速度module.exports = { entry: './src/js/index.html', ... devServer: { ... // 开启HMR功能 // 当修改了webpack配置,新配置要想生效,必须重新webpack服务 hot: true ... } ...}原创 2020-08-02 11:24:06 · 557 阅读 · 0 评论 -
Webpack的基本使用
Webpack基础webpack的五个核心概念EntryOutputLoaderPluginsMode安装webpack cli npm i webpack webpack-cli -D -D是–save -dev的缩写运行指令开发环境//webpack会以./src/index.js为入口文件开始打包,打包后输出到./build/bulit.js,整体打包环境是开发环境webpack ./src/index.js -o ./build/built.js --mode=原创 2020-08-01 12:04:37 · 344 阅读 · 0 评论