Mac 前端环境配置

本文已参与「新人创作礼」活动，一起开启掘金创作之路

前言

适用于给一台新的 MacBook 安装一些前端开发所需的环境和软件，包含踩过的坑和解决方案

安装 brew

官网：brew.sh/

执行命令：（如果不能访问外网，这个不太顺利）

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

如果不能翻墙访问外网，建议安装方案：（中科大源）

执行：
/usr/bin/ruby -e "$(curl -fsSL https://cdn.jsdelivr.net/gh/ineo6/homebrew-install/install)"
安装成功后执行下面两句设置环境变量：
echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> /Users/wenshuangyun/.zprofile
eval "$(/opt/homebrew/bin/brew shellenv)"

如果遇到：Failed to connect to raw.githubusercontent.com port 443

解决办法：

1. 打开网站：ipaddress.com/website/raw…
2. 在下面4个ip中任选1个：
3. 输入命令 sudo vim /etc/hosts，把上一步的ip添加进去然后保存即可：

安装 git

官网下载链接：git-scm.com/download/ma…

更多内容详见：juejin.cn/post/715683…

安装 Nodejs

官网：nodejs.org/zh-cn/

下载安装程序，然后就一步一步地安装即可。
node -v 能看到版本号即为安装成功。

更多内容详见：juejin.cn/post/715684…

安装 nvm

nvm是一个node版本管理工具，也可以直接用 node 的 n 模块去管理版本

cd ~/
git clone https://github.com/nvm-sh/nvm.git
cd nvm
./install.sh   // 运行安装脚本
vim ~/.bash_profile
添加下面这段：
    export NVM_DIR="$HOME/.nvm"
    [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
    [ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"
vim ~/.zshrc
添加下面这句：
    source ~/.bash_profile
source ~/.zshrc
nvm --version // 检查是否安装成功

更多内容详见：juejin.cn/post/715684…

安装 Yarn

官网：yarn.bootcss.com/docs/instal…

sudo npm install --location=global yarn

安装 VsCode

官网：code.visualstudio.com/

下载之后解压即可使用

推荐安装的 插件 详见：juejin.cn/post/715685…

安装 Python2

官网：www.python.org/downloads/r…

之前的 mac 会自带 python，我的系统版本是 Monterey 12.4，没有自带 python

下载完后就一路点继续即可

检查是否安装成功：python --version

安装 XCode

Xcode 会包含一些开发环境，在 App Store 中安装即可