webpack介绍

Webpack4

1. wepack4与其他版本的区别 速度更快，创建大型项目节约的90%构建时间 内置了更多的默认设置，变更了许多API 不局限于版本，全面账务、全面掌握webpack4

2. webpack是什么 webpack是一个模块打包工具。是一个现代应用程序的静态模块打包器。当webpack处理应用程序时，她会递归的构建一个依赖关系图，其中包含应用程序需要的每个模块，然后将所有这些模块打包成一个或多个 bundle。

3. 常用模块规范 commonjs： 使用module.exports或者exports导出，使用require加载。代表：node

   amd： 使用define定义模块，使用require加载，依赖前置。代表：requirejs

   cmd: 使用define定义模块，使用require加载，就近依赖。代表：seajs

   esmodule export导出，import加载。推荐写法。

4. 模块打包工具 顾名思义，就是用来分辨模块的依赖关系，组织模块代码的工具。对于webpack模块，有着更广泛的类型支持，不仅仅是js模块而已。（虽然本质上还是先翻译成js模块，但是形式上支持各种类型的模块）。 总的来说，webpack 提供了可定制的、强大和丰富的 API，允许任何技术栈使用 webpack，保持了在你的开发、测试和生成流程中的无侵入性(non-opinionated)。

5. webpack正确的安装环境 首先要下载node.js，打开node.js官网，

因为这个版本更稳定。 打开终端输入 node -v， npm -v

然后npm init 初始这个项目。全部按回车

安装webpack 全局安装webpack

局部安装

然后出现的 输入npx webpack -v

对index.js 进行打包，

1 自己在根目录下创建webpack.config.js文件。

2. 如果想要创建 webpackconfig.js文件，就在命令符中输入 npx webpack --config webpackconfig.js

webpack-cli

下载webpack-cli，是为了，能过使用webpack，与npx。

webpack打包输出内容

填上如图下的代码：就不会报出警告