webpack4 学习 (多插件实现，包含测试及打包后服务器的运行)

learn-webpack

学习webpack

环境

node 8.9.1
npm 5.7.1
webpack 4

script

开发模式 - npm run dev
打包 - npm run build
运行打包后的文件 - npm run server

实现
  1. 多入口 html - 配置入口 config/entry.json
  2. base64 处理limit限制以下的图片
  3. css预处理
  4. dev模式下热重载
  5. babel-loader 转es5
  6. image-webpack-loader 压缩图片
  7. SplitChunksPlugin 提取公共js
  8. postcss-loader 自动增加css3前缀
  9. html-withimg-loader 增加html识别图片路径
  10. 分类css img js 到不同的文件夹中

github传送门

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • webpack教程
    无意中看到zhangwnag大佬分享的webpack教程感觉受益匪浅，特此分享以备自己日后查看，也希望更多的人看到...
    小小字符阅读 12,542评论 7赞 35
  • webpack学习总结
    Webpack学习总结 此文只是自己学习webpack的一些总结，方便自己查阅，阅读不变，非常抱歉！！ 下载安装：...
    Lxs_597阅读 4,592评论 0赞 0
  • webpack介绍、配置、使用
    版权声明：本文为博主原创文章，未经博主允许不得转载。 webpack介绍和使用 一、webpack介绍 1、由来 ...
    it筱竹阅读 13,844评论 0赞 21
  • webpack学习笔记
    http://blog.csdn.net/weizengxun/article/details/53448885 ...
    晓卢轩阅读 3,790评论 0赞 0
  • 乡村匠人——锡匠
    家里的钢精锅烧破了一个洞，极小极小的眼，可是，再不能用了。母亲不甘心，装上一锅子水，把它放在煤炉上，钢精锅像尿频的...
    周世恩阅读 3,788评论 0赞 3