webpack
文章平均质量分 81
webpack
Y 铭
这个作者很懒,什么都没留下…
展开
-
webpack-打包优化
项目本身:减少依赖嵌套深度使用尽可能少的处理webpack层面:Dll处理通过include减少loader范围HappyPackUglify优化减少resolve,sourcemap,cache-loader用新版本的node和webpack代码分割多页面: 主业务代码 + 公共依赖 + 第三方包 + webpack运行代码单页面:主业务代码 + 异步模块 + 第三方包 + webpack运行代码1.单页面对于单页面,主要是拆分,减少体积,把需要异步加载的改成.原创 2021-04-29 12:17:40 · 279 阅读 · 0 评论 -
webpack—基础配置
1.webpack 命令官方解释:webpack是一个现代的JavaScript应用的静态模块打包工具。(1)使用全局webpackwebpack4以上版本 webpack-cli --entry ./app.js --output build.js webpack4以下版本 webpack --entry ./app.js --output build.js (2)使用本地webpackpackage.json文件中 增加下面命令,打包会优先使用项目中的webpack打包。使用默认配置原创 2021-04-29 10:11:55 · 713 阅读 · 0 评论 -
webpack 打包优化
webpack 打包优化速度优化优化图片使用 url-loader 优化, 将小图片转化成base64压缩,防止小图片太多请求次数太多。:下载 url-loader npm install -D url-loader2: 配置 在 webpack.prod.conf.js 文件夹中配置 module: { rules: [{ test: /\.(png|svg|jpg|gif)$/, use: [{原创 2021-03-14 11:17:02 · 88 阅读 · 0 评论 -
webpack
webpackwebpack构建流程从启动webpack构建到输出结果经历了一系列过程,它们是:解析webpack配置参数,合并从shell传入和webpack.config.js文件里配置的参数,生产最后的配置结果。注册所有配置的插件,好让插件监听webpack构建生命周期的事件节点,以做出对应的反应。从配置的entry入口文件开始解析文件构建AST语法树,找出每个文件所依赖的文件,递归下去。在解析文件递归的过程中根据文件类型和loader配置找出合适的loader用来对文件进行转换。原创 2020-12-06 15:21:19 · 131 阅读 · 0 评论