用 Homebrew 搭建完整的 Web 开发环境

本文将指导你使用 Homebrew 从零开始搭建一个完整、高效的 Web 开发环境。无论你是前端开发者、全栈工程师，还是刚入门的新手，这篇教程都能帮你快速配置好所有必需的开发工具。

前置条件

确保你已经安装了 Homebrew，如果还没有安装，请参考快速开始。

核心开发工具

1. Git 版本控制

brew install git

配置你的 Git 信息：

git config --global user.name "Your Name"
git config --global user.email "[email protected]"

2. Node.js 和 npm

推荐使用 nvm 来管理 Node.js 版本，这样可以轻松切换不同项目所需的 Node 版本：

# 安装 nvm
brew install nvm

# 创建 nvm 工作目录
mkdir ~/.nvm

# 配置环境变量（zsh）
echo 'export NVM_DIR="$HOME/.nvm"' >> ~/.zshrc
echo '[ -s "/opt/homebrew/opt/nvm/nvm.sh" ] && \. "/opt/homebrew/opt/nvm/nvm.sh"' >> ~/.zshrc
echo '[ -s "/opt/homebrew/opt/nvm/etc/bash_completion.d/nvm" ] && \. "/opt/homebrew/opt/nvm/etc/bash_completion.d/nvm"' >> ~/.zshrc

# 重新加载配置
source ~/.zshrc

# 安装最新的 LTS 版本
nvm install --lts
nvm use --lts
nvm alias default node

3. Yarn 包管理器

brew install yarn

前端开发工具

1. 代码编辑器 - Visual Studio Code

brew install --cask visual-studio-code

2. 浏览器开发工具

# Chrome 浏览器
brew install --cask google-chrome

# Firefox 开发者版本
brew install --cask firefox-developer-edition

3. 前端构建工具

# 全局安装常用的前端工具
npm install -g @vue/cli create-react-app vite @angular/cli

后端开发工具

1. Python 环境

# 安装 Python
brew install python

# 安装 pyenv 管理多个 Python 版本
brew install pyenv

# 配置 pyenv
echo 'export PYENV_ROOT="$HOME/.pyenv"' >> ~/.zshrc
echo 'export PATH="$PYENV_ROOT/bin:$PATH"' >> ~/.zshrc
echo 'eval "$(pyenv init -)"' >> ~/.zshrc

2. PHP 环境

# 安装 PHP
brew install php

# 安装 Composer
brew install composer

3. Java 环境

# 安装 OpenJDK
brew install openjdk

# 创建符号链接
sudo ln -sfn /opt/homebrew/opt/openjdk/libexec/openjdk.jdk /Library/Java/JavaVirtualMachines/openjdk.jdk

数据库工具

1. MySQL

# 安装 MySQL
brew install mysql

# 启动 MySQL 服务
brew services start mysql

# 安全配置
mysql_secure_installation

2. PostgreSQL

# 安装 PostgreSQL
brew install postgresql

# 启动 PostgreSQL 服务
brew services start postgresql

3. Redis

# 安装 Redis
brew install redis

# 启动 Redis 服务
brew services start redis

4. MongoDB

# 添加 MongoDB tap
brew tap mongodb/brew

# 安装 MongoDB Community Edition
brew install mongodb-community

# 启动 MongoDB 服务
brew services start mongodb-community

开发辅助工具

1. 终端增强

# 安装 iTerm2
brew install --cask iterm2

# 安装 Oh My Zsh
sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

# 安装更好的终端主题和插件
brew install powerlevel10k
brew install zsh-autosuggestions
brew install zsh-syntax-highlighting

2. API 开发和测试

# 安装 Postman
brew install --cask postman

# 命令行 HTTP 客户端
brew install httpie

3. 容器化工具

# 安装 Docker Desktop
brew install --cask docker

4. 版本控制 GUI

# 安装 Sourcetree
brew install --cask sourcetree

# 或者 GitHub Desktop
brew install --cask github

代码质量工具

1. 代码格式化和检查

# ESLint 和 Prettier（通过 npm 全局安装）
npm install -g eslint prettier

# 安装 EditorConfig 支持
brew install editorconfig

2. 代码分析工具

# SonarQube Scanner
brew install sonar-scanner

性能监控和调试

1. 网络分析

# 安装 Wireshark
brew install --cask wireshark

# 命令行网络工具
brew install wget curl

2. 系统监控

# 安装 htop（更好的 top 命令）
brew install htop

# 安装 tree（目录树显示）
brew install tree

设计和原型工具

# 安装 Figma
brew install --cask figma

# 安装 Sketch
brew install --cask sketch

环境配置优化

1. 创建开发目录结构

# 在用户目录下创建开发文件夹
mkdir -p ~/Development/{Projects,Learning,Tools}

2. 配置常用别名

将以下内容添加到 ~/.zshrc：

# 开发相关别名
alias ll='ls -alF'
alias la='ls -A'
alias l='ls -CF'
alias ..='cd ..'
alias ...='cd ../..'

# Git 别名
alias gs='git status'
alias ga='git add'
alias gc='git commit'
alias gp='git push'
alias gl='git pull'

# 快速启动常用服务
alias start-mysql='brew services start mysql'
alias stop-mysql='brew services stop mysql'
alias start-redis='brew services start redis'
alias stop-redis='brew services stop redis'

3. 环境变量配置

# 将常用路径添加到 PATH
echo 'export PATH="/opt/homebrew/bin:$PATH"' >> ~/.zshrc
echo 'export PATH="$HOME/.local/bin:$PATH"' >> ~/.zshrc

验证安装

创建一个简单的检查脚本来验证环境配置：

echo "=== 开发环境检查 ==="
echo "Git: $(git --version)"
echo "Node.js: $(node --version)"
echo "npm: $(npm --version)"
echo "Python: $(python3 --version)"
echo "PHP: $(php --version | head -n 1)"
echo "MySQL: $(mysql --version)"
echo "Redis: $(redis-server --version)"
echo "Docker: $(docker --version)"

常用开发流程

创建新的前端项目

# React 项目
npx create-react-app my-react-app
cd my-react-app
npm start

# Vue 项目
vue create my-vue-app
cd my-vue-app
npm run serve

# Vite 项目
npm create vite@latest my-vite-app
cd my-vite-app
npm install
npm run dev

数据库操作

# 连接 MySQL
mysql -u root -p

# 连接 PostgreSQL
psql postgres

# 连接 Redis
redis-cli

故障排除

权限问题

如果遇到权限问题，可以修复 Homebrew 权限：

sudo chown -R $(whoami) /opt/homebrew/*

环境变量问题

如果命令找不到，检查是否正确配置了环境变量：

echo $PATH

服务启动问题

查看服务状态：

brew services list

保持环境更新

定期更新你的开发环境：

# 更新 Homebrew 和所有包
brew update && brew upgrade

# 更新 Node.js 包
npm update -g

# 更新 Python 包
pip3 list --outdated --format=freeze | grep -v '^\-e' | cut -d = -f 1 | xargs -n1 pip3 install -U

总结

通过本教程，你已经成功搭建了一个完整的 Web 开发环境，包括：

✅ 版本控制系统（Git）
✅ 前端开发工具（Node.js, npm, Yarn）
✅ 后端开发环境（Python, PHP, Java）
✅ 数据库系统（MySQL, PostgreSQL, Redis, MongoDB）
✅ 开发辅助工具（编辑器、浏览器、API 测试工具）
✅ 容器化工具（Docker）
✅ 代码质量工具

这个环境配置可以满足大部分 Web 开发需求，你可以根据具体项目要求进行调整和扩展。

参考资源

如果你在配置过程中遇到问题，欢迎查看 FAQ 或提交 Issue 寻求帮助。

需要帮助？

建议先查阅 FAQ

扫码回复"brew"进群