从零开始使用 Webpack 搭建 Vue3 开发环境 创建项目 首先需要创建一个空目录，在该目录打开命令行，执行 npm init 命令创建一个项目，这个过程会提示输入一些内容，完成后会自动生成一个 package.json 文件 Webpack 的配置文件 project projec...

本文按照搭建顺序展开，个人觉得没必要。但有些知识点还是需要啰嗦几句。 所有配置代码和安装命令都于留言板上，可以跳过文章内容直接看。 创建文件夹 新建文件夹：mkdir react-webpack 打开文件夹：cd react-webpack 快速初始化项目 npm init -y 文件夹中自动...

前言 对于现在的前端项目而言，编译发布几乎是必需操作，有的编译只需要几秒钟，快如闪电，有的却需要10分钟，甚至更多，慢如蜗牛。特别是线上热修复时，分秒必争，响应速度直接影响了用户体验，用户不会有耐心等那么长时间，让你慢慢编译；如果涉及到支付操作，产品损失更是以秒计，每提前哪怕一秒钟发布，在腾讯...

前言 伴随着vue的全球化，各种vue的组件框架越来越完善，从早期的element-ui到vux，iview等越来越多高质量的项目，使用vue进行前端构建已然是一件工程化，模块化，敏捷化的事情 在这其中，相信很多人都会选择官方的vue-cli初始化工程模板，然后通过引入第三方组件框架和工具的方...

copy-webpack-plugin 安装 npm install --save-dev copy-webpack-plugin 作用：在webpack中拷贝文件和文件夹 from 定义要拷贝的源文件 from：__dirname "/src/components" ...

webpack 本质上是一个打包工具，它会根据代码的内容解析模块依赖，帮助我们把多个模块的代码打包。 一切文件：JavaScript、CSS、SCSS、图片、模板，在 Webpack 眼中都是一个个模块，这样的好处是能清晰的描述出各个模块之间的依赖关系，以方便 Webpack 对模块进行组合和...

module webpack 的初衷是让 js 支持模块化管理，并且将前端中的各种资源都纳入到对应的模块管理中来，所以在 webpack 的设计中，最重要的部分就是管理模块和模块之间的关系。 在 webpack 支持的前端代码模块化中，我们可以使用类似 import * as m from "...

loader 基本上都是第三方类库，使用时需要安装，有一些 loader 还需要安装额外的类库，例如 less-loader 需要 less，babel-loader 需要 babel 等。 loader 匹配规则 loader的配置是放在 module 字段下,如下代码前面提到过： modu...

mode 和 plugin 前边我们介绍 mode 时提过，mode 不同值会影响 webpack 构建配置，其中有一个就是会启用 DefinePlugin 来设置process.env.NODE_ENV 的值，方便代码中判断构建环境。 除此之外，development和 production...

概览 新建项目 npm init -y 安装webpack & webpack-cli (c)npm install -D webpack (c)npm install -D webpack-cli # 查看webpack版本 (npx )webpack --version 试打包 sr...