注意:本实例中的webpack
v2.1.0, extract-text-webpack-plugin
v2.0.0。目前网络上很多例子都是webpack
_v1.x_和extract-text-webpack-plugin
_v1.x_的版本。不同的版本中主要是webpack.config.js
写法有点差异。
- 按模块编译文件(js、css、image等);
- 支持资源部署(合并、压缩、Hash化、最小化);
- 支持watch模式,自动编译;
- 支持Css局部化;
- 编译 jsx、es6、scss 等资源;
- 按指定模块化规范自动包装模块
- 复写模块里的CSS
- 实时编译和刷新浏览器
- 自动引入静态资源到相应html 页面
- 发布到远端机
- 全局替换指定字符串
- 本地接口模拟服务
- 自动给 css 添加浏览器内核前缀
- 语法检查
-
安装依赖
npm install
-
运行npm
npm start
也可以用
npm run dev
,修改源码后就会自动编译了。 -
访问页面
直接用浏览器打开
index.html
文件,或者配置服务器打开index.html
文件。