核心组件:vscode、谷歌浏览器、Node.js(重点)、git
一、Node.js安装(nvm安装)
点击macos中的终端,保持bash,而不是zsh
若为zsh,则可在终端中使用下面命令变成bash
chsh -s /bin/bash
然后输入mac电脑密码,回车,重启终端即可,便是如下图所示的图片:
接着输入:
sudo vi /etc/hosts
其中,sudo 是使用超管权限,vi 是打开文本编辑器的指令,vi 后面空一格,后面跟文件的路径
输入开机密码,回车,便可看见:
光标放到最后的localhost后面,输入i,进入编辑,将下列的内容复制进去:
# GitHub520 Host Start
140.82.113.25 alive.github.com
140.82.112.6 api.github.com
185.199.108.153 assets-cdn.github.com
185.199.111.133 avatars.githubusercontent.com
185.199.111.133 avatars0.githubusercontent.com
185.199.111.133 avatars1.githubusercontent.com
185.199.110.133 avatars2.githubusercontent.com
185.199.110.133 avatars3.githubusercontent.com
185.199.111.133 avatars4.githubusercontent.com
185.199.111.133 avatars5.githubusercontent.com
185.199.111.133 camo.githubusercontent.com
140.82.113.21 central.github.com
185.199.111.133 cloud.githubusercontent.com
140.82.112.9 codeload.github.com
140.82.114.21 collector.github.com
185.199.111.133 desktop.githubusercontent.com
185.199.111.133 favicons.githubusercontent.com
140.82.112.3 gist.github.com
54.231.226.153 github-cloud.s3.amazonaws.com
52.217.234.41 github-com.s3.amazonaws.com
3.5.8.106 github-production-release-asset-2e65be.s3.amazonaws.com
52.216.245.236 github-production-repository-file-5c1aeb.s3.amazonaws.com
16.182.103.113 github-production-user-asset-6210df.s3.amazonaws.com
192.0.66.2 github.blog
140.82.114.4 github.com
140.82.113.18 github.community
185.199.110.154 github.githubassets.com
151.101.193.194 github.global.ssl.fastly.net
185.199.108.153 github.io
185.199.110.133 github.map.fastly.net
185.199.108.153 githubstatus.com
140.82.112.25 live.github.com
185.199.111.133 media.githubusercontent.com
185.199.111.133 objects.githubusercontent.com
13.107.42.16 pipelines.actions.githubusercontent.com
185.199.110.133 raw.githubusercontent.com
185.199.110.133 user-images.githubusercontent.com
140.82.113.21 education.github.com
185.199.111.133 private-user-images.githubusercontent.com
# Update time: 2025-01-03T20:09:20+08:00
# Update url: https://raw.hellogithub.com/hosts
# Star me: https://github.com/521xueweihan/GitHub520
# GitHub520 Host End
按下esc键,退出编辑。
最后输入
:wq
保存。
验证下,输入:
cat /etc/hosts
已成功验证,现在开始安装脚本:(有概率会失败,所以要反复安装如下命令,方可success)
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.1/install.sh | bash
将其中的这个【红色框住的】复制下:
然后接着输入:
vi ~/.bashrc
回车。
将复制的内容粘贴进去:
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion" # This loads nvm bash_completion
输入:wq 保存退出即可
最后我们输入:
source ~/.bashrc
回车。【对环境变量进行加载】
最后输入如下命令,查看远端提供的nodejs的版本
nvm ls-remote
其中,绿色的是长期维护的版本
命令下载:【下载绿色版本】
nvm install v22.12.0
通过
node -v
查询版本
到此结束
二、vscode中从常用的前端开发插件
live sever 插件:页面实时代码效果
代码写好后,点击右下角“go live”