甄clever

1. 使用ref定义数据 reactive 通常用于form表单校验的时进行定义 提交数据时form表单校验（类似vue2的this.$refs.dom.validate） route router

IDEA 中前端优化 （ES6 to ES5 js 压缩混淆 css 预编译 css 压缩） ::: ES6 to ES5，js 压缩混淆是基于 node 环境进行，在进行操作前需先安装 node 环

webpack- 提升打包构建速度 HotModuleReplacement 减少代码体积 treeshaking

SourceMap 是什么？ SourceMap是生成的源文件和打包后文件一一映射的一种.map文件 打包后文件很难定位到源文件出现的问题，需要通过sourceMap与源文件建立联系，方便定位问题 咋

css处理 处理之前：Css文件被打包到js文件中，当js文件加载时创建style标签生成样式（会闪屏） 预期效果：通过link标签加载，生成单独的css文件 安装 引入 css兼容性处理 下载包 n

HtmlWebpackPlugin 作用： 简化Html文件生成，自动生成HTML文件 安装： 引入使用： 服务开发自动化 自动化打包 安装npm i webpack-dev-server -D 配置

Eslint 可组装的Javascript和JSX检查工具，可以配置rule规则 配置文件 根目录下 - .eslintrc.js 文件 基本配置 parserOptions rules 具体规则 "

修改打包输出路径 自动清空上一次内容 output输出中设置 - clean:true 字体图标 其他资源

webpack处理样式资源基础使用 webpack本不能识别样式资源，需要借助各种loader帮助webpack解析样式资源 通过main.js引入css样式文件，样式会被加入到style标签中