【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 插件以获得更好的开发体验。

相关推荐
淡忘旧梦2 分钟前
词错误率/WER算法讲解
人工智能·笔记·python·深度学习·算法
癫狂的兔子3 分钟前
【Python】【爬虫】爬取虎扑网NBA排行数据
数据库·爬虫·python
愚公移码6 分钟前
蓝凌EKP产品:关联机制浅析
java·服务器·前端
Aurora-Borealis.10 分钟前
Day40 早停策略和模型权重的保存
python
好大哥呀12 分钟前
如何在手机上运行Python程序
开发语言·python·智能手机
_codemonster13 分钟前
手语识别及翻译项目实战系列(一)环境准备
人工智能·python·计算机视觉
毕设源码-钟学长14 分钟前
【开题答辩全过程】以 基于Python的新闻热点舆情分析系统为例,包含答辩的问题和答案
开发语言·python
2401_8414956415 分钟前
【Python高级编程】单词统计与查找分析工具
数据结构·python·算法·gui·排序·单词统计·查找
XerCis15 分钟前
Python代码检查与格式化工具Ruff
开发语言·python
西红市杰出青年22 分钟前
asyncio.gather 内部原理与运行机制(详解)
网络·python·异步