0

0

如何在Mac上安装Node.js和NPM?(前端开发环境)

裘德小鎮的故事

裘德小鎮的故事

发布时间:2025-12-30 01:49:35

|

939人浏览过

|

来源于php中文网

原创

最推荐在Mac上使用fnm安装Node.js和NPM,因其轻量、快速、原生支持Apple Silicon;执行curl安装命令、配置shell、安装LTS版并验证版本即可完成,图形化方式可选官网.pkg但不便版本管理。

如何在mac上安装node.js和npm?(前端开发环境)

在Mac上安装Node.js和NPM最推荐的方式是使用版本管理工具fnm(Fast Node Manager),它轻量、快速、原生支持Apple Silicon(M1/M2/M3芯片),比nvm更简洁,也比直接下载.pkg安装更利于后续升级和多版本切换。

用fnm一键安装Node.js和NPM

fnm会自动安装最新LTS版Node.js(含配套NPM),全程命令行操作,无需图形界面:

  • 打开终端(Terminal),运行安装命令:
    curl -fsSL https://fnm.vercel.app/install | bash
  • 按提示将fnm加入shell配置(如~/.zshrc),然后重载配置:
    source ~/.zshrc
  • 安装并设为默认版本:
    fnm install --lts && fnm use --lts && fnm default --lts
  • 验证是否成功:
    node -vnpm -v 应分别输出版本号(如 v20.11.1 和 10.2.4)

如果偏好图形化安装(适合新手)

可前往nodejs.org官网,下载「macOS Installer (.pkg)」文件(推荐选LTS版本):

  • 双击.pkg按向导完成安装,系统会自动把Node.js和NPM添加到/usr/local/bin
  • 安装后重启终端,运行which nodewhich npm确认路径存在
  • 注意:这种方式默认无法轻松切换Node版本,升级需重新下载安装包

验证与基础配置(安装后必做)

装完别急着写代码,先检查环境并优化常用设置:

StickerBaker
StickerBaker

免费开源的AI贴纸头像生成工具

下载

立即学习前端免费学习笔记(深入)”;

  • 确认全局模块安装路径:
    npm config get prefix(通常为/usr/local~/.local/share/fnm/...
  • npm全局bin目录加入$PATH(fnm已自动处理;若用.pkg安装,可能需要手动加:
    echo 'export PATH="/usr/local/bin:$PATH"' >> ~/.zshrc && source ~/.zshrc
  • 换国内镜像加速(尤其npm install时):
    npm config set registry https://registry.npmmirror.com

常见问题快速排查

遇到命令未找到或权限错误,大概率是路径或权限问题:

  • command not found: node → 检查source ~/.zshrc是否执行,或确认shell类型(echo $SHELL
  • permission denied(全局安装报错)→ 不要用sudo npm install -g,改用fnm或修复npm权限:
    mkdir ~/.npm-global && npm config set prefix ~/.npm-global && echo 'export PATH=~/.npm-global/bin:$PATH' >> ~/.zshrc && source ~/.zshrc
  • M1/M2 Mac上某些包编译失败 → 先运行softwareupdate --install-rosetta(按提示安装Rosetta),再重试

基本上就这些。用fnm安装,5分钟内搞定干净可用的前端开发环境,后续切版本、升Node、配镜像都方便。不复杂但容易忽略的是PATH配置和镜像设置——这两步补上,日常开发基本不会卡在环境上。

相关专题

更多
curl_exec
curl_exec

curl_exec函数是PHP cURL函数列表中的一种,它的功能是执行一个cURL会话。给大家总结了一下php curl_exec函数的一些用法实例,这个函数应该在初始化一个cURL会话并且全部的选项都被设置后被调用。他的返回值成功时返回TRUE, 或者在失败时返回FALSE。

422

2023.06.14

linux常见下载安装工具
linux常见下载安装工具

linux常见下载安装工具有APT、YUM、DNF、Snapcraft、Flatpak、AppImage、Wget、Curl等。想了解更多linux常见下载安装工具相关内容,可以阅读本专题下面的文章。

172

2023.10.30

js正则表达式
js正则表达式

php中文网为大家提供各种js正则表达式语法大全以及各种js正则表达式使用的方法,还有更多js正则表达式的相关文章、相关下载、相关课程,供大家免费下载体验。

506

2023.06.20

js获取当前时间
js获取当前时间

JS全称JavaScript,是一种具有函数优先的轻量级,解释型或即时编译型的编程语言;它是一种属于网络的高级脚本语言,主要用于Web,常用来为网页添加各式各样的动态功能。js怎么获取当前时间呢?php中文网给大家带来了相关的教程以及文章,欢迎大家前来学习阅读。

240

2023.07.28

js 字符串转数组
js 字符串转数组

js字符串转数组的方法:1、使用“split()”方法;2、使用“Array.from()”方法;3、使用for循环遍历;4、使用“Array.split()”方法。本专题为大家提供js字符串转数组的相关的文章、下载、课程内容,供大家免费下载体验。

246

2023.08.03

js是什么意思
js是什么意思

JS是JavaScript的缩写,它是一种广泛应用于网页开发的脚本语言。JavaScript是一种解释性的、基于对象和事件驱动的编程语言,通常用于为网页增加交互性和动态性。它可以在网页上实现复杂的功能和效果,如表单验证、页面元素操作、动画效果、数据交互等。

5214

2023.08.17

js删除节点的方法
js删除节点的方法

js删除节点的方法有:1、removeChild()方法,用于从父节点中移除指定的子节点,它需要两个参数,第一个参数是要删除的子节点,第二个参数是父节点;2、parentNode.removeChild()方法,可以直接通过父节点调用来删除子节点;3、remove()方法,可以直接删除节点,而无需指定父节点;4、innerHTML属性,用于删除节点的内容。

470

2023.09.01

js截取字符串的方法
js截取字符串的方法

js截取字符串的方法有substring()方法、substr()方法、slice()方法、split()方法和slice()方法。本专题为大家提供字符串相关的文章、下载、课程内容,供大家免费下载体验。

204

2023.09.04

俄罗斯搜索引擎Yandex最新官方入口网址
俄罗斯搜索引擎Yandex最新官方入口网址

Yandex官方入口网址是https://yandex.com;用户可通过网页端直连或移动端浏览器直接访问,无需登录即可使用搜索、图片、新闻、地图等全部基础功能,并支持多语种检索与静态资源精准筛选。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

1

2025.12.29

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
快速入门Node.JS全套完整版
快速入门Node.JS全套完整版

共83课时 | 8.1万人学习

nodejs开发基础教程
nodejs开发基础教程

共15课时 | 4.5万人学习

JavaScript设计模式视频教程
JavaScript设计模式视频教程

共28课时 | 5.2万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号