前端工程化：

在实际开发中会使用命令工具CLI一键生成带有webpack的项目

layUi：elementui vantui 等

模块化 (js css 资源的复用叫模块化)

组件化 (ui结构 样式 行为的复用叫组件化)

规范化(目录结果的划分，编码规范化，接口规范化，文档规范化，git分支管理)

自动化(自动化构建，自动部署，自动化测试)

前端工程化：在企业的前端项目开发中，把前端开发所需的工具，技术，流程，经验等进行规范化。

企业中的vue项目和react项目，都是基于工程化的方式进行开发的

前端开发自成体系，有一套标准的开发方案和流程。

Webpack：前端工程化的具体解决方案，webpack是模块打包机

它提供了友好的前端模块化开发支持，以及代码压缩混淆，处理浏览器端javascript的兼容性，性能优化等强大的功能。

Webpack的基本使用：

新建项目空白目录，并运行npm init -y命令，初始化包管理配置文集package.json

新建src源代码目录

新建src->index.html首页和src->index.js脚本文件

初始化首页基本结构

运行npm install jquery -S命令，安装jquery

通过ES6模块化的方式导入jQuery，实现效果// import $ from ‘jquery’ //$(function(){}})

Webpack的安装：

安装两个包：npm install [email protected] [email protected] -D

Webpack的配置：

在项目根目录中，创建名为webpack.config.js的webpack配置文件，并初始化如下的基本配置：

在package.json的脚本scripts节点下，新增dev脚本如下：

在终端中运行npm run dev 命令，启动webpack进行项目的打包构建