首页
首页
沸点
课程
直播
活动
竞赛
商城
APP
插件
搜索历史
清空
创作者中心
写文章
发沸点
写笔记
写代码
草稿箱
创作灵感
查看更多
会员
登录
注册
打包工具
无距
创建于2021-05-17
订阅专栏
记录webpack,gulp,rollup等前端打包工具常用技巧和issues
暂无订阅
共7篇文章
创建于2021-05-17
订阅专栏
默认顺序
默认顺序
最早发布
最新发布
webpack缓存优化
babel解析js是非常耗时的,想象一下,假如我们有100个js文件,某一时刻只修改了其中一个,构建的时候还是会对这100个文件进行解析,这显然是不够高效的。这时候我们可以给babel加一个缓存,再次构建时,对那些没有发生修改的js文件,直接从缓存中读取解析结果而不需要重新解析…
tapable钩子实现
最近在阅读webpack源码的时候,发现在webpack的编译器(compiler.js)里用到了tapable,于是查资料学习了以下,这里做一个学习记录。 异步钩子分为异步并发(Parallel)执行和异步串行(Series)执行,从hook名字我们就可以看出来。
webpack打包图片资源
webpack只能处理js模块,在js中加载图片模块时需要借助file-loader。如 url-loader可以把较小的图片转化成base64数据,从而减少对图片资源的http请求。同时打包文件也会变大; 当图片大小超过设置的限制(limit)时,默认采用file-loade…
webpack打包优化
index 和 other 分别作为两个入口文件,且都引用了a,b两个模块。我们可以使用webpack的optimization配置抽离a,b到单独的模块,index 和 other 只需要引入抽离的公共模块即可,不需要再单独引入a,b。配置如下: 此刻,如果我们还引用了第三方…
webpack解决跨域问题
实际开发过程中,跨域问题是一个老生常谈的问题了,从webpack角度出发可提供以下三种解决方案。话不多说,直接上干货
webpack编译打包 JS / TS
@babel/preset-env设置useBuiltIns:"entry"时,需要手动引入polyfill,设置useBuiltIns:"usage"时,polyfill作为全局对象引入,容易造成全局变量污染。@babel/plugin-transform-runtime可以…
webpack处理样式文件
项目更目录下新建webpack.config.js或者webpackfile.js。配置如下: 在css-loader插件执行之前采用less-loader编译less成css。配置webpack解析项目中.less文件如下: 在css-loader插件执行之前采用sass-l…