webpack 初试

优点较为突出：打包 html, css, js, png/jpg

打包方法：2种

方法1： 同一级目录下打包（较为简单基础）

方法2：命令行打包(推荐)

配置 webpack.config.js打包命令：$ webpack  

具体可以参照 github 原作者文档（适合入门）：
https://github.com/manlili/webpack_learn

注意事项（可能出现的问题）：

1. cnpm 安装 sass-loader 依赖包丢失，需要把其余的补上或者直接 npm
2. html 里面读取配置的title，module 里面没有 html-loader 才可生效
3. 打包图片和字体，file-loader 和 url-loader 是有区别的。
   file-loader： 相对于当前执行 webpack 命令的目录的相对路径
   url-loader： 当前打包地址的路径下（比较好用）

附 webpack.config.js 配置：

附 js 打包 webpack.config.js

//babel-loader 编译 ES6 to ES5 语法, 供浏览器解析var path = require('path');var webpack = require('webpack');module.exports = {    entry: __dirname + '/components/js/index',    output: {        path: path.resolve(__dirname, './'),        filename: 'main.js'    },    module: {        rules: [{            test: /\.js$/,            include: path.resolve(__dirname, './components/js'),            use: {                loader: 'babel-loader'            }        }]    }}

直接执行命令（webpack）即可打包成功。

—-end