Webpack前端资源打包工具基础教程与配置指南.pdfVIP

一、什么是Webpack

Webpack

是一个前端资源加载/打包工具。它会根据模块的依赖关系进行静态分析，然后按照指

定规则将这些模块生成对应的静态资源。

如图所示，Webpack

能将多种静态资源如

js、css、s

转换成一个静态文件，从而减少页面

请求次数。

二、Webpack安装

1、全局安装

1npm安装

-gwebpackwebpack-cli

2、安装后查看版本号

1webpack-v

一、什么是Webpack

Webpack是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析，然后将这些

模块按照指定的规则生成对应的静态资源。

从图中我们可以看出，Webpack可以将多种静态资源js、css、s转换成一个静态文件，减少

了页面的请求。

二、Webpack安装

1、全局安装

1npminstall-gwebpackwebpack-cli

2、安装后查看版本号

1webpack-v

三、初始化项目

1、创建webpack文件夹

进入webpack目录，执行命令

1

npm

init

‑y

2、创建src文件夹

3、src下创建common.js

1exports.info=function(str