从0开始配置Mac前端基本开发环境 |
您所在的位置：网站首页 › macos搭建小皮 › 从0开始配置Mac前端基本开发环境 |
从0开始配置Mac前端基本开发环境
|
Mac前端环境搭建
大家好，我又来了，之前在滴滴实习了几个月，这次换了个公司实习，又拿到了一台新的Mac，所以就记录了一下自己配置基本前端开发环境的过程，也可以给一些有需要的朋友做一下参考。希望可以帮助到大🏠 Homebrew拿到一台新的Mac，就是需要安装各种我们平时常用到的软件了。首先建议安装的就是Homebrew(Homebrew是Mac OSX下使用的包管理工具,用来安装OS系统中没有预装的东西) 地址Homebrew官网 按command + 空格，然后输入terminal，控制台上输入/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"便可以进行安装 等到安装完成了，就会显示这个 出现安装成功提示之后，就可以配置路径了。 控制台输入echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> /Users/这里是电脑的用户名/.zprofile 然后再输入eval "$(/opt/homebrew/bin/brew shellenv)" 完成上面两步之后，控制台输入brew -v出现版本号那就是配置成功了 Git环境安装完homebrew之后就可以使用homebrew来进行Git的安装了。Git安装官网 控制台输入brew install git 如果安装成功了，最后输入git --version可以看到版本号 初始化安装好git之后就要进行初始化操作。第一次使用git的时候我们需要给git配置用户名和邮箱，用户和邮箱可以使用github的，也可以使用自己公司的gitlab仓库的账号 配置用户名 git config --global user.name "用户名" 复制代码配置邮箱 git config --global user.email "邮箱地址" 复制代码配置好这个以后我们输入便可以看到我们所有的配置信息了，然后可以看到user.name和user.email配置得对不对 git config -l 复制代码然后就可以配置ssh密钥了。ssh密钥允许系统和gitlab之间建立安全连接。在上传代码的时候使用https需要频繁的输入密码，而使用ssh的话可以省去这个步骤。 检查SSH秘钥是否存在。控制台输入：cat ~/.ssh/id_rsa.pub 若密钥不存在，就需要生成SSH 密钥 。执行命令ssh-keygen -t rsa -C "邮箱地址" 在gitlab上添加SSH key。执行命令查看公钥：cat ~/.ssh/id_rsa.pub，然后将显示出来的一大串字符串复制下来 打开gitlab的找到Profile Settings下的SSH Keys，在Add an SSH key中，将刚刚复制的一大串字符串密钥粘贴到Key的框框里，在Title这里给这个key设置一个响当当的名字，点击Add key就大功告成。 控制台优化 zshzsh（z-shell）是一款用于交互式使用的shell，也可以作为脚本解释器来使用。其包含了 bash，ksh，tcsh 等其他shell中许多优秀功能，也拥有诸多自身特色。 从 MacOS Catalina 版开始，其默认shell从bash改为zsh。) 如果机器上当前安装的zsh不是最新版本(zsh --version查看当前版本)，可以使用brew install zsh安装。 oh-my-zsh下载官网 兼容bash 自动cd：只需输入目录的名称即可 命令选项补齐：比如输入git，然后按Tab，即可显示出git都有哪些命令 目录一次性补全：比如输入Doc/doc按Tab键会自动变成Documents/document/ 各种提效插件和美化主题的支持 看到这个的时候就表示安装成功了。 常用zsh提效插件zsh-syntax-highlighting 语法高亮插件 依次输入以下的命令 git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting 复制代码 vim ~/.zshrc 复制代码在文件里找到plugins=(git)，括号是插件列表，git是默认安装的插件。添加插件 plugins=( git zsh-syntax-highlighting ) 复制代码让插件生效 source ~/.zshrc 复制代码zsh-autosuggestions 自动路径补全 输入命令时可提示自动补全（会出现灰色的命令提示，你曾经访问过的命令），然后按键盘 → (右方向键) git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-autosuggestions 复制代码 vim ~/.zshrc 复制代码在文件里找到plugins，添加 plugins=( git zsh-syntax-highlighting zsh-autosuggestions ) 复制代码让插件生效 source ~/.zshrc 复制代码接下来重启一下 terminal 终端，就可以了 autojump 跳转插件 实现目录间快速跳转，想去哪个目录直接 j + 目录名，或者想在Finder打开哪个目录就直接jo + 目录名，不用频繁的 cd 了 安装 brew install autojump 复制代码 vim ~/.zshrc 复制代码在文件里找到plugins，添加 plugins=( git zsh-syntax-highlighting zsh-autosuggestions autojump ) 复制代码然后在zshrc文件末尾(最后一行)添加 [[ -s $(brew --prefix)/etc/profile.d/autojump.sh ]] && . $(brew --prefix)/etc/profile.d/autojump.sh source $ZSH/oh-my-zsh.sh 复制代码让插件生效 source ~/.zshrc 复制代码 Node环境安装主要是node和常用的工具 brew install node 复制代码安装完成后输入node -v显示版本号就安装成功了 node版本管理工具安装 brew install nvm 复制代码然后按照安装提示，创建 .nvm 目录 mkdir ~/.nvm 复制代码编辑 ~/.zshrc 配置文件 vim ~/.zshrc 复制代码下面命令可以查看 nvm 的安装地址 brew --prefix nvm 复制代码有些电脑是：/usr/local/opt/nvm，有些可能是 /usr/homebrew/opt/nvm，下面的路径是跟这个安装地址相关的 在 ~/.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 复制代码让配置生效 source ~/.zshrc 复制代码然后输入nvm -v查看版本号，显示版本号则安装成功 |
【本文地址】