WebPack合并js

### webpack 命令

- 全局安装

> npm install -g webpack webpack-cli

- 安装后查看版本

> webpack -v

- 监听

webpack -w

### 初始化项目

1. 创建webpack文件夹

> npm init -y

2. 创建文件夹

3. src下创建common.js

- main.js

> const util = require("./util");

> const common = require("./common");

-

### readmi

> 1. 创建一个nodejs项目 你配吗init -y

> 2. 创建一个src目录

> 3. 在src存放两个需要合并的js文件(比如: util.js和common.js)

> 4. 准备一个入口文件 main.js 其实就是模块集中进行引入

> 5. 在根目录下定义个webpack.config.js文件配置打包的规则

// 导入path模块

const path = require("path");

// 定义js打包的规则

module.exports = {

// 1.入口函数从哪里开始进行编译打包

entry:"./src/main.js",

// 2.编译成功后吧内容输出到哪里去

output:{

// 2.1 定义输出的指定的目录__dirname是根目录,产生一个dist文件

path:path.resolve(__dirname,"./dist"),

// 2.2 合并的js文件存储在dist/bundle.js文件中

filename:"bundle.js

}

}

> 6. 执行webpack查看效果