mac解决删除cli2报错:permission denied, access ‘/usr/local/lib/node_modules/vue-cli/node_modules/ansi-wrap‘

本文详述了Vue CLI 3的安装步骤,包括如何解决卸载旧版Vue CLI时遇到的权限错误,并介绍了如何在新旧版本间实现项目创建的兼容性。

vue脚手架3安装及卸载vue-cli报错的解决

vue cli3安装官方描述:

程序包名称从更改vue-cli为@vue/cli。如果vue-cli已全局安装了以前的(1.x或2.x)软件包,则需要先使用npm uninstall vue-cli -g或卸载它yarn global remove vue-cli。Vue CLI需要Node.js 8.9或更高版本(建议使用8.11.0+)。安装:npm install -g @vue/cli

由于我之前在mac笔记本上安装过脚手架2,所以要使用脚手架3就必须要将之前的2卸载,但是在执行卸载命令的时候报错:
error
报错原因是当前用户没有权限删除vue-cli文件夹下的内容,解决办法是在npm卸载命令前加上sudo,以管理员的身份来执行:
在这里插入图片描述
命令执行成功,vue-cli被成功删除:
在这里插入图片描述
cli2卸载成功后执行 npm install -g @vue/cli命令,即可完成脚手架3的安装,但是脚手架2与脚手架3创初始化目的方式不同,如果想在创建项目的时候二者皆可使用,需拉取 2.x 模板进行兼容:
npm install -g @vue/cli-init

最后初始化项目按照自己项目需要选择相应的特性即可
cli2初始化项目:
vue init webpack my-project
cli3初始化项目:
vue create my-project

macOS 系统中,当用户尝试使用 `npm install -g @vue/cli` 命令全局安装 Vue CLI 时,可能会遇到如下错误: ``` Error: EACCES: permission denied, mkdir '/usr/local/lib/node_modules/@vue' ``` 此错误表明当前用户没有足够的权限在 `/usr/local/lib/node_modules` 目录下创建文件夹。该问题通常与系统权限配置或 Node.js 的全局模块安装路径有关。 ### 推荐解决方案 #### 方法1:更改 npm 的全局安装目录(推荐) 为了避免权限问题,可以将 npm 的全局安装路径更改为用户拥有写权限的本地目录,例如 `~/.npm-global`。 **操作步骤:** 1. 创建新的全局安装目录: ```bash mkdir '~/.npm-global' ``` 2. 配置 npm 使用新目录作为全局安装路径: ```bash npm config set prefix '~/.npm-global' ``` 3. 将以下内容添加到 `~/.bashrc` 或 `~/.zshrc` 文件中,以便将新路径加入环境变量: ```bash export PATH=~/.npm-global/bin:$PATH ``` 4. 应用更改并验证: ```bash source ~/.bashrc # 或 source ~/.zshrc npm bin -g ``` 完成上述配置后,即可使用 `npm install -g @vue/cli` 命令进行无权限限制的全局安装[^2]。 #### 方法2:使用 `sudo` 提升权限(不推荐) 虽然可以通过 `sudo` 执行命令以获得临时管理员权限,但这种方法可能带来安全风险,并且不是长期解决方案。 ```bash sudo npm install -g @vue/cli ``` 系统会提示输入密码,正确输入后可继续安装。建议仅在紧急情况下使用此方法。 #### 方法3:使用 nvm 管理 Node.js 版本(补充) 安装 [nvm](https://github.com/nvm-sh/nvm)(Node Version Manager)可以避免此类权限问题,因为它会在用户的主目录下安装 Node.js 和 npm 包,确保所有操作都在用户权限范围内。 **安装 nvm:** ```bash curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash ``` 重新加载 shell 配置后,即可通过 nvm 安装 Node.js 并管理多个版本: ```bash nvm install node npm install -g @vue/cli ``` 这样无需修改权限或使用 `sudo` 即可顺利安装全局包。 ---
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值