使用VSCode快速创建一个Vue项目

一、准备工作

1、安装Node.js

（1）可在官网 https://nodejs.org/en/ 下载node.js，node.js安装完成之后会同步安装npm。

（2）配置环境变量：把node.js安装路径配置到环境变量Path中，一般在使用node.js安装包安装时会自动添加环境变量。

（3）查看node.js是否安装成功：打开cmd，输入node -v 和 npm -v 如果显示版本信息，则说明安装成功。如下图：

2、修改淘宝镜像源

        注意淘宝镜像源于2022年更改了域名，修改时要使用新的域名，可在cmd使用如下命令设置淘宝镜像源。

npm config set registry https://registry.npmmirror.com/

3、安装pnpm

        也是 Node.js 的包管理工具，并且是最新的 Node.js 的包管理工具。

npm i pnpm -g

4、安装nrm

        nrm是用于管理 Node.js 包管理器（npm、yarn、pnpm）镜像源的工具。

npm i nrm -g

二、使用VSCode创建Vue项目

1、在电脑上创建一个项目目标文件夹，然后用VSCode打开这个文件夹。

2、打开文件夹后，用View->Terminal打开终端（也可以直接用快捷键“Ctrl + `”直接打开终端）。

3、在终端选择Command Prompt

4、输入pnpm create vite

5、输入你想要的项目名称，例如vite-project，回车

6、选择Vue，回车

6、选择JavaScript，回车

7、出现如图所示的提示，即表示项目创建成功

8、按照提示依次cd进项目目录、pnpm install、pnpm run dev即可运行项目

9、在浏览器地址栏输入终端提示里的地址，如上图的http://localhost:5173/，出现如下图的界面，即表示运行成功啦~