webapck安装

1. 先安装nodejs，这里就不演示了。
   

2. 分为全局安装和局部安装，套路都差不多，这里以局部安装为实例

安装webpack

新建文件夹

npm init

一路回车

npm webapck webapck-cli -D

webpack-cli 可以使在命令行中正常的使用webapck命令

新建webpack.confog.js用来配置webpack

var path = require('path');
module.exports = {
    entry: './index.js',
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, 'bundle')
    }
}

entry代表文件入口 output代表出口文件，也就是打包后的文件

指定webpack配置文件

npx webpack --config  配置文件的名称

script使用

script是用来指定启动命令的，之前我们都是使用npx webpack 来执行webapck打包，可以配置命令执行webpack

"scripts": {
    "bundle": "webpack"
  },

指定打包的环境model

production生产环境，打包后的js被压缩，

development 开发环境，js不被压缩

var path = require('path');
module.exports = {
    mode: 'development',
    entry: './src/index.js',
    output: {
        filename: 'main.js',
        path: path.resolve(__dirname, 'dist')
    }
}