webpack简介与安装

一、webpack简介

1.webpack是什么？

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

2.webpack作用

1. 打包（把多个文件打包成一个js文件，减少服务器压力，带宽）
2. 转化（比如less sass ts）需要loader
3. 优化（SPA越来越盛行，前端项目负责度高，webpack可以对项目进行优化）

3.webpack构成

1. 入口 entry
2. 出口 output
3. 转化器 loaders
4. 插件 plugins
5. devServer 开发服务器
6. 模式 mode

具体概念可查看官网

二、webpack安装

前提条件：安装webpack之前请确保电脑上已经安装了node.js，如果没有安装可以去官网下载

1.全局安装

 npm install --global webpack

2.本地安装

npm install --save-dev webpack

如果你使用 webpack 4+ 版本，你还需要安装 CLI。

npm install --save-dev webpack-cli

3.安装特定版本

npm install --save-dev webpack@<version>

npm install --save-dev
简写：npm install -D
只在开发环境中安装，生产环境中不安装
·
npm install --save
简写：npm install -S
开发环境和生产环境中全都安装

前端进阶精选：点此去