Vue的环境搭建及安装过程

001

1.Vue框架

创建项目:

1. 先搭建webpack环境或在老项目中进行

2. 整个项目都是vue,

1. 使用脚手架搭建开发环境
   安装脚手架： npm install -g @vue/cli
   初始化项目命令：vue create project

步骤：

第一步, vue create 后会出现 至少3个选项，
（ 第一个选项是默认安装vue2,babel,eslint
第二个选项是默认安装 vue3，babel,eslint
第三个选项 (Manually select features) 自定义安装）
第二步，选择自定义安装
（第一个选项 vue的版本
第二个 babel
第三个 ts 先不选
第四个 PWA 离线缓存
第五个 Router 路由
第六个 vuex 公共数据存储
第七个 css 预处理语言 (less,sass,stylus)
第八个 linter 代码监测
第九，十个 代码测试 ）
第三步：
选择vue的版本
Class-style组件，先选no
Babel 解析ts ，选y
路由模式：
是否使用history模式
选y 就是 history模式
选n 就是 hash模式
Css 预处理语言
（选项1：sass(dart-sass) 新版本的sass语法，速度比较快，一般使用sass都选这个版本
选项2：sass(node-sass) 老版本的sass语法
选项3： less
选项4： stylus）
Lint 的配置
（选项1：eslint 基础版本
选项2：eslint + airbnb 特别严格的版本
选项3：eslint + standard 比较严格的版本
选项4：eslint + prettier 加代码规范
选项5：tslint 监测ts）
lint功能什么时候执行
（选项1：保存时代码监测
选项2：提交(commit)时或运行监测时）
代码测试的工具：
（选项1：Mocha + chai
选项2：jest ）
E2e 测试工具：
Nightwatch 相对多一些
代码测试使用的浏览器：
Chrome
firefox
第四步：
Babel，eslint 的配置文件要放在哪？
（选项1： 生成独立的配置文件
选项2： 生成到package.json中）
第五步：
是否保存当前配置
默认不保存
选y就是保存
如果保存，会让定义一个名称
第六步：
安装
安装完成
目录结构：
安装开发工具插件：

本文地址：https://blog.csdn.net/Yanxiaona111/article/details/109629425