每次学新东西总感觉自己是不是变笨了，看了几个博客，试着试着就跑不下去，无奈只有去看官方文档。 webpack是基于node的。先安装最新的。
1.初始化
安装node后，新建一个目录，比如html5。cmd中切到当前文件夹。
这个命令会创建一个默认的package.json。它包含了项目的一些配置参数，通过它可以进行初始安装。详细参数：。
不要y参数的话，会在命令框中设置各项参数，但觉得没啥必要。
2.安装webpack
将webpack安装到当前目录。虽然npm install webpack -g 可以讲webpack安装到全局，但是容易出现一些模块找不到的错误，所以最好还是安装到当前目录下。
3.目录结构
webpack是一款模块加载各种资源并打包的工具。所以先建一个如下的目录结构：
app包含的开发中的js文件，一个组件，一个入口。build中就是用来存放打包之后的文件的。webpack.config.js 顾名思义用来配置webpack的。package.json就不用说了。
component.js
component.js 是输出一个内容为h1元素。export default 是，表示指定默认输出。import的时候不用带大括号。
index.js
index.js 的作用就是引用Component模块，并在页面上输出一个h1元素。但完成这个还需要一个插件，因为目前我们还没有index.html文件。
html-webpack-plugin的用来生成html，将其也安装到开发目录下面。
4.设置 webpack 配置文件
我们需要通过webpack.config.js文件告诉webpack如何开始。配置文件至少需要一个入口和一个输出。多个页面就需要多个入口。node的
app: path.join(dirname,'app'),build: path.join(dirname,'build'),};
module.exports = {
entry: {
app: PATHS.app,},output: {
path: PATHS.build,filename: '[name].js',plugins: [
new HtmlWebpackPlugin({
title: 'Webpack demo',}),],};
第一次看到这个配置文件是有点懵，主要是exports，分三个部分，一个入口，一个输出，一个插件。入口指向了app文件夹。默认会把包含"index.js"的文件作为入口。输出指定了build地址和一个文件名；[name]这儿表示，可以看成webpack提供的一个变量。这个具体后面再看。而会生成一个默认的html文件。
5.打包
有了以上准备，直接输入 webpack 就能运行了。
这个输出包含了Hash(每次打包值都不同),Version,Time(耗时)。以及输出的文件信息。这时打开build文件夹，发现多了一个app.js和index.html文件，双击index.html：
也可以修改下package.json
指定build。在cmd中执行npm run build 得到同样的结果
index.html:
