女王控的博客

前端构建工具

11 篇文章

Webpack5新特性

从 2017 年发出关于 v5 的投票开始,到 2019 年 10 月发布第一个 beta 版本,目前是 5.0.0-beta.16。现在在收集使用反馈、生态升级的过程中,相信不久后就可以正式发布了。这次升级重点:性能改进、Tree Shacking、Code Generation、Module Federation。 下面我们跟着 Changelog 来动手,测测重点内容~ 优化持久缓存 首先简单说 Webpack 中 graph 的概念: Webpack 在执行的时候,以配置的 entry… »

Webpack脚手架搭建笔记——记一次新项目搭建

接上文 Webpack 升级优化——记一次产品端升级 最近需要开发一个新产品,此时需要一个新框架来承载新产品的开发,根据前端主管的建议,建议我在他已经开发出的新框架上进行改造,这里记录一下改造的关键点 babel 编译兼容 IE 在 .babelrc 文件里加上标红代码,防止 ie 某些方法报错 脚本运行颜色 在将 npm script 写成 nodejs 脚本时,脚本颜色是灰色,此时需要加上 参数 webpack 加速构建 在 webpack.base.babel.js 文件中添加 hard… »

Webpack升级优化——记一次产品端升级

接上文 Webpack 配置笔记 分包策略 在分支 上启动 脚本,得到分包策略如下: 首屏加载对比 原始首屏加载 升级后加载 分包优化步骤 echarts 只提取需要的包 immutable 指向同一份,避免 draft 与 antd 重复打包 分大模块改写法 根据路由来分 这里原来的路由引用模块已经是 形式的了,所以我在 里的 加了如下策略 经实验,可以看到各个页面只加载所需的包 根据组件来分 对其中比较大的组件进行了懒加载处理,react-player/draft… »

记一次组件打包为链接的实践

需求背景 最近要做一个将第三方聊天库打包为链接,以便于顾客端使用,类似于这个样子 , 以实现将代码嵌入到顾客端网站的 标签之前即可完成部署,开发过程中遇到诸多难点 需求难点 打包工具选型 最容易想到的办法就是沿用公司之前的 webpack 框架,这里升级到了 webpack4(见之前的文章 Webpack 配置笔记 ),考虑到打包后可能会包含一些 webpack 的多余代码,因此不是最优方案。但迫于技术的不成熟以及开发时间的压力,还是把 webpack… »

webpack 配置笔记

webpack4 配置一览 基于 react-boilerplate 技术栈 antd + react + less 不断更新 前端的发展 模块化 模块化是指把一个复杂的系统分解到多个模块以方便编码。 挂载到变量 jQuery 库把它的 API 都放在了 下,在加载完 jQuery 后其他模块再通过 去使用 jQuery 命名空间冲突,两个库可能会使用同一个名称,例如 Zepto 也被放在 下; 无法合理地管理项目的依赖和版本; 无法方便地控制依赖的加载顺序。 CommonJS… »

0%