vue3学习笔记

1. vue3.0新特性介绍

重写双向数据绑定
vDOM性能瓶颈
Fragments
Tree-Shaking的支持
Composition API

2. 配置环境

nvm下载:NVM for Windows 下载地址: github.com/coreybutler…
nvm查看版本号:nvm -v
nvm查看所有执行命令:nvm --help
nvm查看所有版本:nvm list available
安装指定版本的nvm:nvm install 16.13.2
查看已安装的nvm:nvm list
切换使用nvm版本:nvm use 14.19.3
卸载nvm:nvm uninstall 14.19.3
安装vite:npm init vite@latest
问题1:执行nvm use 16.14.0后出现乱码提示
在这里插入图片描述
此时我们需要检查nvm所在文件夹名称是否含有空格或者中文,如果含有空格或者中文修改文件夹名称即可解决该问题

问题2:执行nvm install 16.15.0后输入node -v 提示‘node‘ 不是内部或外部命令,也不是可运行的程序 或批处理文件
vue3学习笔记_第1张图片
此时,需要卸载电脑里本来就安装好的node.js,nvm刚刚安装好的指定版本的文件夹也需要删除,在nvm文件夹下手动新建一个名为nodejs的文件夹:vue3学习笔记_第2张图片
由于我的nvm安装在E:/software下,于是我修改环境变量如图
vue3学习笔记_第3张图片
重新执行nvm install 16.15.0并重启命令窗口执行nvm use 16.15.0 和 node -v 发现该问题被解决了
第一种:vite方式构建项目:npm init vite@latest – – template vue
切到根目录下安装依赖:npm install
第二种:vue方式构建项目:npm init vue@latest
切到根目录下安装依赖:npm install

三、认识目录、插件

下载volar插件
vue3学习笔记_第4张图片

禁用vetur
vue3学习笔记_第5张图片
注意:如何解决vue3代码爆红的问题?
禁用volar,重启vscode即可
vue3学习笔记_第6张图片

你可能感兴趣的:(学习,笔记)