## 1.安装yarn
npm install yarn -g
## 2.初始化文件
yarn init -y
## 3.安装webpack
yarn add webpack webpack-cli -D
## 4.创建src文件夹  创建index.js文件
## 5.演出加载
defer
## 6.webpack配置
webpack.config.js
## 7.入口文件
确认打包路径
## entry:"./src/a.js"
## entry: ['./src/a.js','./src/index.js']
## entry: {hi:'./src/a.js',hello:'./src/index.js'}
## 8.环境
mode: 
development 开发
production 生产
## 9.出口文件 output
filename 文件名字
path 指定打包文件夹名字(使用时候需引入path路径)
clean 清除打包文件夹中其余的文件
## 10.打包命令：yarn webpack
## 11.loader插件
module配置
{
    配置所有规则数组
    rules:[
        {
          test 属性，识别出哪些文件会被转换。
          use 属性，定义出在进行转换时，应该使用哪个 loader。
        }
    ]
}
## 12.babel 
npm install -D babel-loader @babel/core @babel/preset-env webpack
{
      test: /\.m?js$/,
      exclude: /(node_modules|bower_components)/,
      use: {
        loader: 'babel-loader',
        options: {
          presets: ['@babel/preset-env'],
        },
      },
    },
## 13.browserslist
匹配可兼容浏览器
## 14.plugin
自动生成html页面 并连接
安装：
yarn add -D html-webpack-plugin
const HtmlWebpackPlugin = require('html-webpack-plugin');
plugins: [
        new HtmlWebpackPlugin({
            template:'./src/index.html'
        })
    ]
## 15.开发服务器
yarn add -D webpack-dev-server
命令：
yarn webpack serve
自动打包 服务器
yarn webpack serve --open

## 16.映射远码
devtool:'inlin-source-map'