webpack 简介
webpack 是基于模块化的打包构建工具，它把一切视为模块，它通过一个开发时态的入口模块为起点，分析出所有的依赖关系，然后经过一系列的 压缩、合并 过程，最终生成运行时态的文件；
webpack 的特点：
为前端工程化而生：webpack 致力于解决前端工程化，特别是浏览器端工程化中遇到的问题，让开发者集中注意力编写业务代码，而把工程化过程中的问题全部交给 webpack 来处理；简单易用：支持零配置，可以不用写任何一行额外的代码就使用 webpack；强大的生态：webpack 是非常灵活、可以扩展的，webpack 本身的功能并不多，但它提供了一些可以扩展其功能的机制，使得一些第三方库可以融于到 webpack 中；基于 nodejs：由于 webpack 在构建的过程中需要读取文件，因此它是运行在 node 环境中的；基于模块化：webpack 在构建过程中要分析依赖关系，方式是通过模块化导入语句进行分析的，它支持各种模块化标准，包括但不限于 CommonJS、ES6 Module；
webpack 的安装
webpack 通过 npm 安装，它提供了两个包：
- webpack：核心包，包含了 webpack 构建过程中要用到的所有 api；
- webpack-cli：提供一个简单的 cli 命令，它调用了 webpack 核心包的 api ，来完成构建过程；
安装方式：
- 全局安装：可以全局使用 webpack 命令，但是无法为不同项目对应不同的 webpack 版本；
- 本地安装：推荐，每个项目都使用自己的 webpack 版本进行构建；
webpack 的使用
-
默认情况下 webpack 会以
./src/index.js作为入口文件分析依赖关系，打包到./dist/main.js文件中； -
通过 –mode 选项可以控制 webpack 的打包结果的运行环境；
{ "name": "test", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "build": "webpack --mode=production", "dev": "webpack --mode=development" }, "author": "", "license": "ISC", "devDependencies": { "webpack": "^4.41.5", "webpack-cli": "^3.3.10" }, "dependencies": { "jquery": "^3.4.1" } }
打赏作者
您的打赏是我前进的动力
微信
支付宝
State：单一状态树
上一篇
评论
