十、Vite3新增语法特性（⼆）

vue-cli 和 vite

 

1、了解vue-cli ，脚手架的理解：

vue 的脚手架，就是vue cli

cli ：Command-line interface  【命令行界面】

2、如何使用vue-cli

安装cli：

npm install @vue/cli -g

为啥全局安装？想要在电脑的任何位置都可以识别

vue-cli 升级版本：npm update @vue/cli -g

通过命令创建项目：

vue create 项目名称   

eg: vue create helloworld

 选择是空格，下一步是回车

3、git 上面下载下来的项目，

1、首先npm install 安装依赖

2、看package.json里面scripts 中如何运行

4、vue-cli 原理

太难理解了，跳过了

5、

vite 下一代构建工具

面试会问，实际中比较少

6、vite

不使用构建工具的弊端;

1、某些文件【ts, vue】不识别

2、如果包之间依赖太多，那么会发送过多的网络请求

vite 依赖node ,要求版本大于12

6.1、vite安装和使用

npm install vite -g  全局安装

npm install vite -D  局部安装

使用vite 启动项目

npx vite

7、vite 原理

将源文件【js,less】进行转换，转换成新的文件（这里全都是es6 的js 代码）

当浏览器真正去请求mul.ts 的时候，对请求做了个拦截，拦截之后对请求做了转发【connect 更容易实现转发】