0


新入手Mac配置前端环境教程

跳槽新进入一家公司 ,给新配置的 Mac 电脑

那么我们接下来该如何步入正常的前端开发流程呢 ?

在此稍微记录一下 , 节省时间 ,以防后期再用到 。

1、安装 Xcode ;

2、安装 Homebrew ;

3、安装 Git ;

4、安装 nvm ;

** 利用 nvm 安装 node 指定版本 ;**

参考文献 :

1、

【git】在mac上用brew安装并配置git教程

2、Mac 系统使用 Homebrew 安装 nvm

https://www.jianshu.com/p/bdbc51fa8ce6

3、

MacOS中brew安装完毕后找不到nvm,zsh: command not found:nvm


1、安装 Xcode

在 App Store 里下载 , 此工具会节省你大量时间

( 耐心等待 , 十多个 G 呢 , 估计得下载几个小时 , 实在不行、可尝试 不下载 )


2、安装 Homebrew

学 Git 需要安装 ,留一个自认为最简单的流程 。

参考 :

1、
Homebrew国内如何自动安装(国内地址)(Mac & Linux)
2、Git 官方下载
Git - Downloading Package

3、

Git实用教程2:安装Git

参考1、知乎专栏 ,出现问题也可去原网站找原因 。

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

打开 Mac 终端 ,复制 粘贴 回车

之后跟着流程走就行 => 下载感觉也挺慢的 , 不要急哦 ~

安装成功后自行检查一下 : brew -v

这里需要按照提示运行一下 :

git config --global --add safe.directory /usr/local/Homebrew/Library/Taps/homebrew/homebrew-core

git config --global --add safe.directory /usr/local/Homebrew/Library/Taps/homebrew/homebrew-cask

至此 , brew 就算完全安装成功啦 ~


3、安装 Git

brew install git

在这里插入图片描述

安装成功如下

ps:如果安装过 Xcode 可以试试

sudo apt-get install git

4、安装 nvm

1、nvm 介绍

当我们使用 node 开发网站时 ,可能会同时需要运行多个项目 ,

每个项目所使用的 node 版本又不相同 ,

或者当我们需要学习新的 node 时 ,多个版本之间的切换和维护会变得非常麻烦和棘手 。

nvm 的出现就是为了解决这个问题 。

详细介绍请看 nvm官网

2、安装 nvm

此处选择 Mac 系统自带的 Homebrew 安装 nvm
Homebrew 是一款 Mac OS 平台下的软件包管理工具 ,

拥有 安装、卸载、更新、查看、搜索 等很多实用的功能 。

简单的一条指令 ,就可以实现包管理 ,而不用你关心各种依赖和文件路径的情况 ,十分方便快捷 。简单来说 ,Homebrew 提供 Apple 没有预装但你需要的东西 。

详情请见 Homebrew官网

2.1、安装 Homebrew( 如已经安装 Homebrew ,直接进行跳到 2.2 )

检查电脑是否有安装 Homebrew ,打开终端输入 :

brew -v

如果出现版本号 ,则表示已安装 Homebrew ,如果提示 :

-bash: brew: command not found

则表示未安装 Homebrew ,需要先安装 Homebrew 。将以下命令复制到终端执行 :

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

等待完成之后,再次输入: brew -v , 得到版本号 ,表示 Homebrew 安装完成

2.2、使用 Homebrew 安装 nvm

如果已经安装 Homebrew ,那么直接在终端输入命令 :

brew install nvm

回车之后即可进行安装,安装成功提示:

==> Summary
🍺 /usr/local/Cellar/nvm/0.33.11: 7 files, 138.6KB, built in 13 seconds

安装成功之后 ,还不能直接使用 nvm 命令 ,需要进行以下配置 ,

将以下命令复制到终端执行 :

echo "source $(brew --prefix nvm)/nvm.sh" >> .bash_profile

修改之后,需要重新定向来源,复制以下命令并执行:

. ~/.bash_profile

此时在终端输入:

nvm list

即可查看当前电脑中安装的 node 版本 ,如果未曾安装 node ,则显示为空 。
接下来就可以使用 nvm 来安装和管理 node 版本了 。


nvm 常用命令介绍

1. nvm list 是查找本电脑上所有的node版本
    - nvm list 查看已经安装的版本
    - nvm list installed 查看已经安装的版本
    - nvm list available 查看网络可以安装的版本
2. nvm install <version> 安装指定版本node
3. nvm use <version> 切换使用指定的版本node
4. nvm ls 列出所有版本
5. nvm current显示当前版本
6. nvm alias <name> <version> ## 给不同的版本号添加别名
7. nvm unalias <name> ## 删除已定义的别名
8. nvm reinstall-packages <version> ## 在当前版本node环境下,重新全局安装指定版本号的npm包
9. nvm on 打开nodejs控制
10. nvm off 关闭nodejs控制
11. nvm proxy 查看设置与代理
12. nvm node_mirror [url] 设置或者查看setting.txt中的node_mirror,如果不设置的默认是 https://nodejs.org/dist/
nvm npm_mirror [url] 设置或者查看setting.txt中的npm_mirror,如果不设置的话默认的是: https://github.com/npm/npm/archive/.
13. nvm uninstall <version> 卸载制定的版本
14. nvm use [version] [arch] 切换制定的node版本和位数
15. nvm root [path] 设置和查看root路径
16. nvm -v / nvm --version 查看当前的版本

利用 nvm 安装 node

# 最新稳定版本 ( 最新尝鲜版 )
nvm install stable

Node.js

# 长期维护版本 ( 推荐下载 )
nvm install 16.18.0


Bug 复现 :

Mac系统安装nvm后,nvm命令找不到

第二天打开终端再次检查昨天安装的东西是否还 “ 健在 ” , 结果有的就没了 。。

那没办法 , 就 只能再想办法解决了 :

1、启动终端 Terminal

2、进入当前用户的 home 目录

cd ~

3、创建 .bash_profile 文件

touch ~/.bash_profile

4、编辑 .bash_profile 文件

open -e .bash_profile

5、在 ~/.bash_profile 添加两行 :

export NVM_DIR=~/.nvm
source $(brew --prefix nvm)/nvm.sh 

6、保存文件 command + S ,关闭 .bash_profile

7、更新刚配置的 环境变量

source .bash_profile    

8、验证是否成功

echo $NVM_DIR

OK , 解决 ~

但是发现关闭终端后 , 再次打开还是老毛病 , nvm / node 啥的就找不到了 ,

nvm: command not found

很不幸,我跟着网上的 N 篇教程,下载完毕之后试过大家给出的 N 种方法,

包括什么重启终端、在 nvm 文件夹里也复制一份 .bash_profile 文件、

手动修改配置文件啥啥啥的,结果还是提示 **nvm: command not found **。

后来找到原因就是说 :

运行 source ~/.bash_profile 之后会生效,但是只生效一次

后来总算找到解决方法,大致是因为我的系统是最新更新的 macOS Catalina 系统,默认的 shell 是 zsh,所以找不到配置文件啥的。

解决方法如下:

open ~/.zshrc

 export NVM_DIR="$HOME/.nvm"
  [ -s "/usr/local/opt/nvm/nvm.sh" ] && \. "/usr/local/opt/nvm/nvm.sh"  # This loads nvm
  [ -s "/usr/local/opt/nvm/etc/bash_completion.d/nvm" ] && \. "/usr/local/opt/nvm/etc/bash_completion.d/nvm"  # This loads nvm bash_completion

Nice ~ , 真正解决了 !!

标签: 前端 macos git

本文转载自: https://blog.csdn.net/weixin_58099903/article/details/127524947
版权归原作者 雨季mo浅忆 所有, 如有侵权,请联系我们删除。

“新入手Mac配置前端环境教程”的评论:

还没有评论