Mac 安装配置前端开发环境

AppStore中下载xcode, 安装适合系统版本的 Xcode

Xcode 安装完成后, 打开终端执行以下命令

xcode-select --install

会唤起 Xcode 来安装命令行工 Command Line Tools

下载 Homebrew

• 去Homebrew官网 https://brew.sh/

官网推荐使用 .pkg 安装器安装, 根据建议下载适合的包

按照提示安装好即可

使用 Homebrew 安装 nvm

打开终端执行以下命令

brew install nvm

执行完成不报错即为已安装成功

配置 nvm shell 文件

终端打开 ~/.zshrc 文件

open ~/.zshrc

如果不存在先创建该文件再打开

touch ~/.zshrc
open ~/.zshrc

配置 nvm 环境变量

文件不为空时, 在最末行追加

# 配置 nvm 环境
export NVM_DIR="$HOME/.nvm"
[ -s "$(brew --prefix nvm)/nvm.sh" ] && \. "$(brew --prefix nvm)/nvm.sh"

# 配置 nvm下载镜像源
export NVM_NODEJS_ORG_MIRROR=https://nodejs.org/dist
export NVM_NODEJS_ORG_MIRROR=https://npmmirror.com/mirrors/node/

# 定义自动加载 .nvmrc 的逻辑
load-nvmrc() {
if [[ -f .nvmrc ]]; then
    local VERSION
    VERSION=$(cat .nvmrc)  # 获取 .nvmrc 文件中的版本号
    
    # 检查当前版本是否与 .nvmrc 中指定的版本相同
    if [[ "$(nvm current)" != "$VERSION" ]]; then
    # 切换 Node 版本
    nvm use "$VERSION" &>/dev/null  # 避免不必要的输出
    if [[ $? -eq 0 ]]; then
        echo "Switched to Node version $(node -v)"  # 显示当前版本
    else
        echo "Error: Failed to switch Node version"
    fi
    else
    echo "Already using Node version $(node -v)"  # 当前版本已经是指定版本
    fi
fi
}

# 使用 chpwd 钩子，确保每次切换目录时执行 load-nvmrc
autoload -U add-zsh-hook
add-zsh-hook chpwd load-nvmrc

# 在终端启动时执行一次 load-nvmrc，确保初始加载时正确
load-nvmrc

重新加载 .zshrc

source ~/.zshrc

查看 nvm 版本号

nvm -v

返回版本号即配置成功

使用 nvm 安装 node

nvm 管理 node

至此开发基本准备工作已完成

使用 Hexo 搭建博客

Hexo 搭建博客

搭建 Vue3 + Vite 项目

Vue3 + Vite 项目搭建