记录一下Vue3项目的搭建

有幸遇到一个非常不错的教程

搭建环境

简单说就是用node装最新的vue-cli

检查node版本

1
node -v

用nvm切换node版本

nvm是推荐的node版本管理工具

教程里用的版本是v14.21.3

1
2
nvm ls <#列出所有版本node#>
nvm use 14

检查vue版本

  • 最低需要5.0以上的vue-cli
  • 如果版本过低，需要先卸载低版本vue-cli，然后重新安装
    1
    2
    3
    vue --version
    npm uninstall vue-cli -g <#卸载低版本vue-cli#>
    npm install @vue/cli@latest <#安装最新版本vue-cli#>

搭建vue3+vite脚手架

回车就完事儿了

创建项目

1
npm create vue@latest <#创建项目#>

输入项目名称，后面的默认都选No

安装依赖，启动项目

1
2
3
cd 项目名
npm install <#安装该vue项目含有的依赖#>
npm run dev <#启动项目#>

如果看到浏览器里显示如图，则项目新建成功！

- 2024.1.23更新 -

安装项目可能会用到的

路由

1
npm install vue-router@4

sass

1
npm install sass

- 2024.1.23更新 -