一.vue开发环境的安装
1.安装Home-brew(Mac自有的程序包管理工具)
1）打开终端运行一下命令安装Homebrew：
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
如果出现以下错误提示：curl: (7) Failed to connect to raw.githubusercontent.com port 443: Operation
可能是网络状态不允许：通过访问“https://raw.githubusercontent.com/Homebrew/install/master/install”网页是否正常显示，无法访问，不断切换网络直到页面可正常显示后，再执行上一步的命令行。
2）安装成功后，查看一下brew的版本信息：
brew -v
3）版本信息未显示出现一下提示“-bash: brew: command not found”
参看：https://blog.csdn.net/li396864285/article/details/52572163
安装nvm
brew install nvm
出现下图表示安装完成
按照提示 继续操作
You should create NVM's working directory if it doesn't exist:
你应该检查nvm的工作空间是否存在 不存在就创建
检查工作目录是否存在
cd ～ // 这个命令在终端任意路径可用 意思是进入到当前用户的跟路径
ls -la // 在用户跟路径查看全部路径
如果存在.nvm则不需要新建目录 如果不存在 则使用mkdir创建
mkdir ~/.nvm
继续配置 nvm的环境变量
Add the following to ~/.bash_profile or your desired shell
configuration file:
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
将configuration file下的shell脚本通过vim 编辑器添加到 ~/.bash_profile 最后,编辑完成后 :wq退出，并 执行
source ～/.bash_profile
完成操作后 通过
echo $NVM_DIR
检查 nvm环境变量是否 生效输出/Users/xxx/.nvm 说明生效了
环境变量配置完成后
nvm ls 命令可查看当前nvm中 管理的node版本
用nvm 安装node
查找可安装的 node 长期维护版本：nvm ls-remote --its
选择长期支持版本安装：nvm install v12.16.1
nvm install 8.0.0 安装指定版本的node
nvm use 8.0 使用指定node版本
nvm run 6.10.3 app.js 使用指定版本 运行js程序
nvm alias default 8.1.0 设置环境默认node版本
nvm alias default node 一直使用最新版本node作为默认版本
默认版本将在所有的工作空间生效
而 use命令只会在当前的命令窗口生效
node 安装完成后 自带npm
使用npm安装 nrm管理 镜像
npm install nrm -g
nrm安装完成后 可以使用nrm ls 查看镜像列表。
使用 nrm use taobao可以快速切换镜像源
名词：
nvm - node version manager - node 版本管理工具
npm - node package manager - node 打包管理工具
nrm - npm registry manager - npm 镜像管理工具
2.安装node.js
1）直接在终端中输入以下命令行安装：
brew install nodejs
2）安装完成后查看node.js的版本信息
node -v
3)获取node.js的访问权限
sudo chmod -R 777 /usr/local/lib/node_modules/
3.替换npm（淘宝镜像）
npm install-g cnpm--registry=https://registry.npm.taobao.org
不要用cnpm cnpm源在中国 很多依赖都找不到 项目报错
4、安装webpack （不用装，与npm一样都是包管理工具 一般都用npm，npm包含打包功能）
npm install webpack -g
5、安装vue脚手架
npm install vue-cli -g
二、项目创建与运行
1. 项目创建
1)cd 本地目录：
cd /Users/xxxx/Desktop/
2)创建项目test-demo:
sudo vue create test-demo
2.启动项目
1）进入test-demo项目文件夹:
cd /Users/xxxx/Desktop/ test-demo
2）运行项目
npm run dev 或 npm run serve
三、MACVScode的必备操作
1.呼出vscode控制台：cmd+shift+Y
2.唤起搜索框：cmd+shift+P 搜锁安装Shell command 'code-insiders' successfully installed in PATH.
3.可能遇上保存或新建文件权限不需要的操作，错误提示如下
Failed to save '***.js': Insufficient permissions. Select 'Retry as Sudo' to retry as superuser
解决方法：1）点击文件，2）找到“显示简介"进入，3）找到“共享与权限”，修改访问权限。4）点击设置选择应用到包含的项目
网友评论