Mac 搭建 Vue 开发环境

风早爽太2026-10-12 11:59

在 Mac 上搭建 Vue 开发环境，核心是装好 ‌Node.js ‌（自带 npm），再全局安装 Vue 脚手架，就能创建和运行项目了。推荐用 ‌Homebrew‌ 管理工具，省心不少。

1. 安装 Homebrew（包管理器） ‌

打开终端，执行下面命令（国内网络建议用这个镜像，速度快）：

javascript 复制代码

/bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN/raw/master/Homebrew.sh)"

安装完‌记得重启终端 ‌，输入 brew -v 能显示版本号就成功了。‌‌

2. 安装 Node.js 和 npm ‌

用 Homebrew 安装，npm 会一起装好：

javascript 复制代码

brew install node

验证是否成功：

javascript 复制代码

node -v
npm -v

能看到版本号就 OK 了。‌‌

3. 配置 npm 镜像（加速下载） ‌

国内直接下载依赖会很慢，建议切换成淘宝镜像：

javascript 复制代码

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

查看是否生效：

javascript 复制代码

npm config get registry

出现 https://registry.npmmirror.com 就是配置好了。‌‌

4. 全局安装 Vue 脚手架（Vue CLI）

javascript 复制代码

npm install -g @vue/cli

安装完验证：

javascript 复制代码

vue --version

5. 创建并运行第一个 Vue 项目‌

javascript 复制代码

# 创建一个项目
vue create my-vue-app

# 进入项目目录
cd my-vue-app

# 启动开发服务器
npm run serve

终端出现 App running at: 和 http://localhost:8080，浏览器打开就能看到 Vue 欢迎页了。‌‌

如果用的是 M 系列芯片的 Mac（M1/M2/M3），Homebrew 默认安装路径在 /opt/homebrew，配置环境变量时注意这个路径。