webpack4升级指南
因为webpack4有很多吸引人的特性，在开发的时候能能提高效率，所以将团队项目的webpack3升级到了webpack4； 新特性 对Node.js版本必须>=8.9.4； 支持WebAssembly； 支持多种模块类型； 通过mode来处理开发环境和线上环境优化； 更简单配置的拆包功能； 更快的热加载功能； 零配置模块打包（output:./dist/main.js；entry:./sr…
Webpack输出资源内容到html文件
需求来源 对于小的项目或者单文件的网页，我们将css文件和js文件可以直接内联插入到html中，可以实现单文件部署（使用场景：例如在一些可视化编辑器上直接粘贴生成的html代码就可以运行了）；当然比较大的项目我们可以注入一些公共的样式和js文件的到html中； 我们使用html-webpack-plugin的插件 https://github.com/DustinJackson/html-webp…
Web页面图片预加载方案
现象 在开发活动时，有一个转盘抽奖的功能，要求抽到每个奖项的时候显示不同的图片，我们内心是这样想的； 然而现实却是这样，图片去哪里了啊，原来是图片比较大（之前没有做优化）加载比较慢，所以我们看到了文本，但是没有看到背景。 因为红包组件是动态替换背景图片的，所以图片没有缓存时，都需要立即发请求，所以就导致了加载慢的问题； 示例代码： <div className={'redpack-…