【Web 前端开发】vue3开发环境部署

1、安装 Node.js 和 npm

访问 Node.js 官网 下载并安装最新的 LTS 版本。

安装完成后,打开命令行工具,

输入 node -v 和 npm -v 检查安装是否成功。

bash 复制代码
 node -v
 npm -v 

如下图:

2、安装 Vue CLI

在命令行工具中输入以下命令安装 Vue CLI:

bash 复制代码
npm install -g @vue/cli

安装完成后,输入 vue --version 检查 Vue CLI 是否安装成功。

bash 复制代码
vue --version 

如果出现异常,vue : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\vue.ps1,因为在此系统上禁止运行脚本。

打开管理员终端,输入以下指令(签名或运行这些脚本)

bash 复制代码
set-ExecutionPolicy RemoteSigned 

再次输入指令,vue --version

3、创建 Vue 3 项目

使用 Vue CLI 创建一个新的 Vue 3 项目:

在自己的指定文件夹中打开终端

bash 复制代码
vue create my-project

选择 Vue 3 版本,并根据提示完成项目配置。

安装完成后如下图

4、启动开发服务器

进入项目目录:

bash 复制代码
cd my-project

启动开发服务器:

bash 复制代码
npm run serve

打开浏览器,访问 http://localhost:8080 查看项目运行情况。

如下图:

5、安装 VS Code(可选)

下载并安装 Visual Studio Code 作为代码编辑器。

安装 Vue.js 插件以获得更好的开发体验。

相关推荐
AI前端老薛3 分钟前
面试:了解闭包吗?
前端
じ☆冷颜〃7 分钟前
基于多数据结构融合的密码学性能增强框架
数据结构·经验分享·笔记·python·密码学
无所事事的海绵宝宝10 分钟前
python基础
开发语言·python
dagouaofei14 分钟前
实测!6款AI自动生成PPT工具体验分享
人工智能·python·powerpoint
Font Tian14 分钟前
Pandas 3.0 全解:从默认字符串类型到 Copy-on-Write 的一场“内存模型重构”
python·重构·数据分析·pandas
轻竹办公PPT16 分钟前
写 2026 年工作计划,用 AI 生成 PPT 哪种方式更高效
人工智能·python·powerpoint
xu_duo_i17 分钟前
vue3+element-plus图片上传,前端压缩(纯函数,无插件)
前端·javascript·vue.js
林恒smileZAZ20 分钟前
在 Web 前端实现流式 TTS 播放
前端
大模型铲屎官21 分钟前
【操作系统-Day 47】揭秘Linux文件系统基石:图解索引分配(inode)与多级索引
linux·运维·服务器·人工智能·python·操作系统·计算机组成原理
睡不着的可乐21 分钟前
前端优化:requestAnimationFrame vs setInterval 性能对比与实战
前端