vue3.0 studay（一） 汇总

一、vue3.0 学习

vue3+typescript创建项目详细步骤如下:

1、新建一个文件夹；

2、vue/cli全局安装：cnpm install -g @vue/cli 或者 npm install -g @vue/cli；

（如果之前是vue/cli 老版本的先卸载了，npm uninstall -g vue-cli   //卸载
 
npm install -g @vue/cli   //安装最新的cli版本）

3、创建项目名称：vue create 项目名称；

4、配置文件（根据个人喜好选择）：

 创建vue3的项目：

vue create vue3-test

1）、第一个选项是预设配置项，第一个只包含babel，eslint，要选第二个，可以自由配置。 

 

 箭头下选:  Manually select features

然后按一次回车键：

 看看这几个都有没有被选中，如果没有箭头下选，敲键盘空格键（空格搭配上下键选择）。就能看到里面带 * 代表选中

babel是用来适配一些js的新特性，浏览器还不支持的，但是可以通过其它方式实现它的语法

typescript就是启用typescript支持

PWA这个是渐进式web应用，如果用不上，不需要选

Router是vue-router

css pre-processors是用来支持css预处理器的，less，sass这些

linter是用来做代码检验的，如代码缩进，规范合不合格之类的，都是它来校验

2）、这2个是自动化测试框架，可以不选；测试代码有没有bug，符不符合预期用的

然后回车，选择3.x

 3）、class-style component syntax，像react的风格，是否启用类作为组件模型，这个建议开启。 输入：y

4）、配置babel对ts，jsx的转义，要开启 输入: y

5）、路由管理模式，Y是HTML5 history，N是hash模式，（自己选择），喜欢地址栏带 # 就输入：y，否则输入： n

 6）、预处理器，根据自己习惯选择； 我个人选择第2个

 7）、这个是代码风格约束的选择项; 我选默认的

 8）、对git提交时候的风格校验；第一个是保存的时候，第二个是commit的时候推荐2个都开启，用git 就选第2个。

 9）、置配置文件的管理路径，建议选第一个，每一个单独生成配置文件，第二个都会堆在package.json，

 10）、把这些配置是否保存为模板，选择N

 开始创建项目：等一会就成功了。

 

 11）、成功创建项目；  cd vue3-test   
然后启动项目：npm run serve