rollup 采用 es6 原生的模块机制进行模块的打包构建，rollup 更着眼于未来，对 commonjs 模块机制不提供内置的支持，是一款更轻量的打包工具。rollup 比较适合打包 js 的 sdk 或者封装的框架等，例如，vue 源码就是 rollup 打包的。而 w…

我们在前端开发中会经常用到命令行工具，比如@babel/cli、vue-cli、create-react-app 等等。那么如何创建一个npm 命令行工具呢？其实很简单的，仅需要几步即可。 创建 1

图片的优化处理汇总，包括选择合适的图片格式，图片压缩，CSS Sprites(雪碧图，CSS 精灵)，图片懒加载，CSS 替换实现，base64 格式，iconfont 字体图标，使用 CDN等等

对于大型项目，动态路由组件动辄几十上百个。webpack 是在编译阶段将所有组件都打包写入到内存，但 vite 仅仅只是在运行时动态请求所需的一个路由组件而已，速度确实是质的提升！ vite 利用现代浏览器天然支持 import 模块化的特性，在运行时动态请求依赖的文件。也就是…

在前面的文章中，小编为大家带来了许多Vue 实战技巧，也得到了大家的许多好评。其实在前面那些技巧之外，我们还可以做的更多，让我们的开发流程更流畅，开发体验更好，项目性能更上一层楼，怎么做呢，我们一起来看看。 在我们开发的时候，为了方便调试，我们需要使用源码进行调试，但在生产环境…

几个月前，我的任务是将我们组的 Vue.js 项目构建配置升级到 Webpack 4。我们的主要目标之一是利用 tree-shaking 的优势，即 Webpack 去掉了实际上并没有使用的代码来减少包的大小。现在，tree-shaking 的好处将根据你的代码库而有所不同。由…

我们都知道JS模块化的演变经历了一个漫长的过程，从最初的CommonJS ，到后来的AMD和CMD，再到今天的ES6模块化方案。优胜劣汰，对于JS这门语言来说，主要用于Node端的模块化方案CommonJS 活了下来，而ES6推出的模块化方案更是赢得了大家的认可，大有可能成为未…

在前端领域中，tree-shaking指的是消除没被引用的模块代码，减少代码体积大小，以提高页面的性能。 在传统

ES modules 给 JavaScript 带来了一个官方的规范的模块化系统。将近花了10年的时间才完成了这个标准化的工作。 我们的等待即将结束。随着 Firefox 60 在今年5月的发布(目前是测试阶段)，所有的主流浏览器都将支持 ES modules，与此同时，Nod…