Vue配置和安装教程（2025最新）

一、配置环境前的准备工作

（一）下载Node.js

下载地址：Node.js 中文网

安装教程

1.选择适合你操作系统的版本

2.找到下载完成的安装包双击安装

3.直接点【Next】按钮，此处可根据个人需求修改安装路径，修改完毕后继续点击【Next】按钮

4.可根据自身需求进行，此处我选择默认安装，继续点击【Next】按钮

5.不选中，直接点击【Next】按钮

6.点击【Install】按钮进行安装

7.安装完毕，点击【Finish】按钮

（二）下载VSCode

下载地址：Visual Studio Code - Code Editing. Redefined

安装教程

1.进入官网点击下载安装包

2.找到下载好的安装包双击安装

3.这里选择默认路径

4.点击下一步

5.安装完成后打开，vscode汉化教程

二、配置环境

（一）打开命令窗口

（二）检查Node环境是否安装成功

1.使用命令

node -v

2.如果安装成功会返回版本

（三）查看node的镜像源

1.输入命令符设置镜像源

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

2.输入命令符检查是否设置成功

npm config get registry

3.显示链接就是设置成功了

（四）创建Vue项目

1.输入命令符

npm create vite

2.输入项目名称

3.选择开发环境（这里选择vue）

4.选择使用的语言（这里选择javascript）

5.配置完成

6.执行三段命令

7.在浏览器查看是否配置成功

三、用vscode打开刚刚创建的项目

（一）打开vscode，打开文件夹

（二）根据上面的路径打开文件

1.这是刚刚创建项目的路径

2.在文件夹找到路径打开

3.出现这样的页面就是打开成功了

四、如何将Vue项目创建在指定位置

（一）拿到要创建位置的地址

1.这里以创建在桌面为例

2.复制路径

（二）运用命令符切换到指定位置

1.打开命令窗口

2.输入命令符

cd 粘贴文件路径

3.按照上面创建项目的步骤重新执行一遍即可