Vue安装

新建vue单页面应用

一共有两种方式：

1. vue/cli

2. vite

vue/cli

vue/cli是基于webpack

1 npm install -g @vue/cli

这样就可以在全局安装vue/cli，输入命令，查看安装是否成功

1 vue  --version
2 #or
3 vue -V

能出现对应的vue/cli的版本，即为安装成功。

在这一步过程中，很可能会出错，出错率10%左右，如果安装明明成功了，但是无法显示版本号，并且提示vue not ...command，则为环境变量需要配置。

1 npm list -g

1 查看全局环境下，包安装路径，复制其，配置电脑的环境变量，重启cmd即可。
2 
3 vue/cli安装成功后，即可新建项目
4 
5 使用`vue/cli`新建项目有两种方式

命令行新建

vue create 文件名

中间经过若干步骤，按需导入使用。

O Babel   把es6等高端代码转成低端代码，供低版本浏览器使用
O TypeScript     TS微软新出的一门语言，可以用来生成js
o Progressive Web App (PWA) Support      移动端app支持
o Router    路由
o Vuex      一种统一状态管理工具（存数据的）
o CSS Pre-processors       css预处理器支持（可以用来把less等高端css语言转成普通css）
• Linter / Formatter     （代码风格）
o Unit Testing      测试
O E2E Testing       测试

vue ui新建（不推荐）

vue ui

正常情况下，会自动打开默认浏览器页面，进行配置

如果出错，检查把杀毒软件都关掉

使用vite新建

不基于webpack，速度更快，体积更小，仅支持vue3.x，不支持2.x，并且目前还不是很稳定，正在完善中，建议将来使用。

npm init vite-app 文件名

如果报错：

Need to install the following packages:
create-vite-app
Ok to proceed? (y)

输入y进行安装create-vite-app即可。