了解webpack一段时间了,今天最近学的知识整合总结一下。
webpack是一个前端模块化的工具,在前端项目越来越大型的情况下,我们有必要学习了解它。
webpack的一些特性
- loader机制,允许我们加载任意格式的资源,社区中有各种各样的加载器。
- plugin机制,在webpack生命周期中内置了很多钩子函数,我们可以利用这些钩子函数,编写插件,满足我们自定义的需求。
- 自动打包更新。热替换(HMR)
- 支持source maps,方便调试。
- 兼容CommonJS,ES6语法。
经常用到的几个插件
npm install webpack-dev-server --save-dev
- 开启一个本地服务,方便调试。
- 配置:proxy:解决本地调试时跨域问题。
- 配置:open:自动打开浏览器。
- 配置:compress:压缩
- 配置:hot:热更新,配合new webpack.HotModuleReplacementPlugin()
npm install html-webpack-plugin --save-dev
- 生成index.html入口文件