MacBook Pro 安装Vue4.0详细步骤含去除原Vue

MacBook Pro 安装Vue3.0详细步骤含去除vue2.0
Mac 安装Vue4.0详细步骤含去除vue2.0

前言
在MacOS上原先已安装的vue2.x等，在卸载过程中提示 ：
npm ERR! errno: -13, npm ERR! code: ‘EACCES’, npm ERR! syscall: ‘access’, 等，无权限问题。
在这里我们将一一解决，根据步骤进行。

正文
1、打开cmd 终端输入命令：npm

 npm

回车键执行

提示内容含有 npm 则记住该存在等路径，例如：

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
[[ -r $NVM_DIR/bash_completion ]] && \. $NVM_DIR/bash_completion

则将其删除掉他们， 执行删除命令：sudo rm xxxx

sudo rm （要删除的路径文件）

例如上一个代码栏目内容：sudo rm $NVM_DIR/nvm.sh 然后回车键盘执行删除。

2、终端执行删除以下数据：（每一行执行一次）

sudo rm /usr/local/bin/node

sudo rm /usr/local/bin/vue

sudo rm ~/.nvm

再次打开终端执行代码： vi ~/.bash_profile
这是显示如何还有带nvm字母的文件路径，就说明没有删除完整，必须重复上述删除。

3、删除工作完成后，就开始重复nvm安装：（打开终端执行这一整条代码）

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.34.0/install.sh | bash

安装完后 终端执行代码：nvm -v 进行查看版本，存在版本号则安装完成，否则重复安装流程。

4、对nvm安装完成后，开始安装cnpm，打开终端执行代码：

sudo npm install -g cnpm --registry=https://registry.npm.taobao.org

安装完成后 终端执行代码：cnpm -v 结果显示版本号则表示安装完成，否则重复安装流程。

5、cnpm安装完成后，开始正式安装我们需要对Vue4，打开终端执行代码安装vue-cli 脚手架：

sudo npm install -g @vue/cli

这个过程比较慢，一直enter键下一步，直到安装成功，安装完成后 终端执行代码：vue -V（注意这里的V字母是大写）。

6、最后一步验证安装结果，我们创建一个 Vue项目，打开终端执行代码：vue create 项目名称 回车键执行：例如

vue create vue4x_web

实时如果出现如下界面：请手动键盘 上下键 选择版本进行安装：

终端显示内容：

Vue CLI v4.5.13
? Please pick a preset: (Use arrow keys)
❯ Default ([Vue 2] babel, eslint) 
  Default (Vue 3) ([Vue 3] babel, eslint) 
  Manually select features 

选择后回车键执行。

总结
在这个安装过程中，任何问题都要，每个人的计算机都出现不同都问题，但互联网分享的结果经验并没有一条是完整的或者说说一模一样的，所以遇到不同的问题，只能分段的去寻找该段问题的解决方案来满足解决问题过程的局部难点。

最后 执行我们安装后浏览器给出的地址 按照提示访问：http://localhost:8080/ 进行浏览安装后web显示结果。当然我们也可以选择另一种安装方式：

创建项目方式2（推荐）：
vue-cli创建项目没有集成webpack相关配置vue-cli创建项目没有集成webpack相关配置的如何解决，所以我门使用vue init webpack方式创建项目。

创建脚手架：

sudo npm install -g @vue/cli-init

创建项目：

vue4x_web：vue init webpack vue4x_web