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