Skip to content

Latest commit

 

History

History
62 lines (49 loc) · 1.86 KB

README.md

File metadata and controls

62 lines (49 loc) · 1.86 KB

项目说明

此项目总共 24 小节,前 15 节基于 Webpack4 渐进式教程 为基础,加上自己的实践和理解得出,感谢 心谭 😄

Webpack4 渐进式教程 的基础上升级:

  • 使用 babel7
  • 配置 .browserslistrc 文件
  • 使用 mini-css-extract-plugin 替代 extract-text-webpack-plugin
  • 使用 optimize-css-assets-webpack-plugin 压缩 css
  • 使用 postcsscss 加上各个浏览器前缀
  • 使用 image-webpack-loader 处理图片

随后的章节以 mooc手把手带你掌握新版 Webpack4.0 整理的学习笔记,感谢 DellLee 老师 😄

目录:

  1. 搭建项目并打包 JS 文件
  2. 生产和开发模式
  3. 覆盖默认 entry/output
  4. 用 Babel 7 转译 ES6
  5. Code Splitting
  6. Lazy Loading、Prefetching
  7. 自动生成 HTML 文件
  8. 处理 CSS/SCSS 文件
  9. JS Tree Shaking
  10. CSS Tree Shaking
  11. 图片处理汇总
  12. 字体文件处理
  13. 处理第三方 js 库
  14. 开发模式与 webpack-dev-server
  15. 开发模式和生产模式・实战
  16. 打包自定义函数库
  17. PWA 配置
  18. TypeScript 配置
  19. Eslint 配置
  20. 使用 DLLPlugin 加快打包速度
  21. 多页面打包配置
  22. 编写 loader
  23. 编写 plugin
  24. 编写 Bundle

环境如下:

OS: 「win10」
node: 「10.5.0」
npm: 「6.1.0」
webpack: 「4.29.6」
webpack-cli: 「3.2.3」

每一个章节对应一个 demo 👉 配套的文档地址

有错误请提 issue

觉得有帮助的小伙伴不妨点个 star~

关于我