11 Webpack 中使用 lint 工具来保证代码风格和质量

当你做成功一件事,千万不要等待着享受荣誉,应该再做那些需要的事。                —— 巴斯德 代码不是写给机器看的,归根结底还是写给人看的! 在团队的项目开发过程中,代码维护所占的时间比重往往大于新功能的开发。因此编写符合团队编

12 使用 Webpack 管理项目中的静态资源

低头要有勇气,抬头要有底气。                ——韩寒 前端项目离不开各种静态资源,静态资源指前端中常用的图片、富媒体(Video、Audio 等)、字体文件等。Webpack 中静态资源也是可以作为模块直接使用的,本小节将介绍下

13 Webpack 中打包 HTML 和多页面配置

辛苦是获得一切的定律。                ——牛顿 在项目中我们除了需要 JavaScript、CSS 和图片等静态资源,还需要页面来承载这些内容和页面结构,怎么在 Webpack 中处理 HTML。并且我们项目也不仅仅是单页应用(

14 Webpack Dev Server 本地开发服务

不想当将军的士兵,不是好士兵。                ——拿破仑 webpack-dev-server是一个基于 Express 的本地开发服务器(看 Roadmap 下个版本内核会从 Express 切换到 Koa)。它使用 webp

15 Webpack 中配置React和Vue开发环境

上天赋予的生命,就是要为人类的繁荣和平和幸福而奉献。                ——松下幸之助 当下前端最火的两个框架就是了 React 和 Vue 了,本篇文章主要介绍手动配置 Webpack 来做 React 和 Vue 的开发。 F

16 Webpack 环境相关配置及配置文件拆分

最聪明的人是最不愿浪费时间的人。                ——但丁 在实际开发实践中,为了方便开发调试和上线,项目中我们一般配置两个 Webpack 配置,一个是开发环境一个是生产环境,开发环境帮助我们快速开发测试联调,生产环境保证上线环

17 Webpack 优化之体积优化

自信和希望是青年的特权。                ——大仲马 Webpack 毕竟是个项目打包工具,一般 web 项目,打完包之后,需要发布到服务器上供用户使用,受带宽的限制,我们的项目体积需要越小越好,所以 Webpack 中打包的体积

18 Webpack 优化之增强缓存命中率

勤学如春起之苗,不见其增,日有所长。                ——陶潜 在 web 开发中,我们应该充分利用 HTTP 协议和浏览器的缓存来做好页面代码的持久化缓存,本文将介绍如何合理配置 Webpack 来更好的提升应用持久化缓存策

19 使用 Webpack 的 splitChunks 功能来拆分代码

读一本好书,就是和许多高尚的人谈话。                ——歌德 在 Webpack4 之前,我们处理公共模块的方式都是使用 CommonsChunkPlugin,然后该插件让开发配置繁琐,并且使公共代码的抽离不够彻底和细致,因此新

20 Webpack 优化之速度优化

什么是路?就是从没路的地方践踏出来的,从只有荆棘的地方开辟出来的。                 —— 鲁迅 当 Webpack 的项目文件多了之后,构建过程会越来越慢,这时候就需要做一些构建速度方面的优化手段了,本篇文章就是介绍了构建速度优