Webpack介绍

Webpack是什么

Webpack是一个现代JavaScript应用程序的静态模块打包器(module bundler)。

当webpack处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个bundle。

Webpack官网：https://webpack.js.org/

Webpack可以干什么

• 可以处理 js 之间互相依赖的关系；
• 可以处理 js 的兼容问题。

Webpack的安装

1. 全局安装

npm i webpack -g

2. 项目根目录安装

npm i webpack --save-dev

Webpack打包文件

1. 通过webpack.config.js配置文件来打包文件

let path = require('path');
module.exports = {
    entry: path.join(__dirname,'./src/main.js'),//入口文件
    output: {                                    
        path: path.join(__dirname,'./dist'),    //输出文件的路径
        filename: 'bundle.js'                     //指定输出的文件名
    }
}

2. 通过命令打包文件：webpack 要打包的文件路径 打包输出的文件路径