node版本升级，从卸载到使用nvm管理node版本并配置vue环境（学习趟雷版）

疯狂的小老鼠

已于 2024-12-01 13:51:41 修改

阅读量2.1k

点赞数 18

分类专栏： vue模块文章标签： vue.js 学习前端 node.js

于 2024-11-15 16:17:51 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_42040328/article/details/143742199

版权

vue模块专栏收录该内容

13 篇文章

订阅专栏

查找node版本和安装路径

查找当前node版本

node -v

查看弄得版本安装路径

where node

在这里插入图片描述

卸载node（没安装过node的可以直接跳过）

通过控制面板删除node，按下【win+R】键，输入control
控制面板找到默认程序
找到node程序点击卸载
等待卸载完成，然后在C盘查找以下文件内是否含有这些内容

C:\Program Files (x86)\Nodejs
C:\Program Files\Nodejs
C:\Users\用户名\AppData\Roaming\npm
C:\Users\用户名\AppData\Roaming\npm-cache
C:\Users\用户名\AppData\Local\npm-cache

检查是否删除完成

node -v
npm -v

在这里插入图片描述

安装nvm

下载nvm 下载地址
安装切记安装nvm的文件夹不要出现中文
nvm的安装路径

4.复制上一步的路径，将 node.js的安装路径放在nvm的安装路径里面
在这里插入图片描述

点击install
点击finish安装完成
在命令行输入 nvm root 查找nvm安装路径
找到nvm所在文件目录下的setting.text
复制以下代码，将nvm的源修改

node_mirror: https://npmmirror.com/mirrors/node/
npm_mirror:  https://npmmirror.com/mirrors/npm/

第一行是nvm按照路径
第二行是node.js的路径
第三行是 node下载镜像
第四行是 npm下载镜像

在这里插入图片描述
10. nvm常用命令

// 1、查看已经安装的node版本
nvm ls

// 2、查看可以安装的node版本
nvm ls available

// 3、安装指定版本
nvm install 版本号

// 4、切换到指定版本
nvm use 版本号

// 5、显示当前版本
nvm current

// 6、给不同的版本添加别名
nvm alias

// 7、删除已定义的别名
nvm unalias

// 8、在当前环境下， 重新全局安装指定版本号的npm包
nvm reinstall-packages

// 9、打开nodejs控制
nvm on

// 10、关闭nodejs控制
nvm off

// 11、查看设置代理
nvm proxy

// 12、卸载指定版本
nvm uninstall 版本号

// 13、设置和查看root路径
nvm root [path]

// 14、查看nvm版本
nvm version

nvm 环境变量配置，

我的电脑>属性>高级系统设置>环境变量
确认配置和以下一致，nvm创建完成会默认生成
命令行 nvm -v 返回版本号，证明按照成功

查找node可安装的最新版本

nvm list available

在这里插入图片描述
13. 安装具体版本，

查看已安装的版本
查看nvm所在文件夹

如果切换node版本失败，出现乱码

可以先检查setting.text的路径是否正确，是否含有空格，如果没有，使用管理员身份打开命令行再输入 nvm use 22.11.0，出现以下情况就是好了
查看nvm文件夹

卸载nvm

直接打开控制面板，找到默认程序，找到nvm直接卸载就行，通过nvm下载的node会跟随nvm一起卸载。
一般环境变量会跟随nvm的卸载删掉，可以打开环境变量，查看是否存在环境变量如果存在删掉就行了

node环境配置

在nvm文件夹内创建 node_global 和node_cache两个文件夹，作为全局的模块安装路径和缓存路径
创建完之后在命令行输入以下命令

npm config set prefix "你的node_global所在文件路径"
npm config set cache "你的node_cache所在文件路径"

在这里插入图片描述
3. 设置用户变量

设置系统变量

新建系统变量：变量名：NODE_PATH，变量值：D:\program\nvm\node_global\node_modules

配置vue安装环境

配置淘宝镜像

npm config set registry https://registry.npmmirror.com
npm config get registry

安装vue脚手架

//安装vue脚手架
npm install -g @vue/cli  
 
vue -V  //查看版本信息,能够查看到就说明安装成功了

创建 vue3+Ts 项目

	Vite 需要 Node.js 版本 >= 12.0.0。

	//全局安装vite 
	npm install -g vite
	//查看版本
	vite -v
	npm create vue@latest //创建vite 工程项目

出现问题 vue -V , vite -v 查不到
找到vue.cmd所在的文件夹，将其配置到系统变量上
重新打开命令行，出现以下这种情况就好了

vue-cli创建vue项目
 vite创建vue项目传送门

vscode 无法使用npm和node

在这里插入图片描述

nvm管理node版本对外的接口是node.js，打开node.js，可以看见npm 在这个文件夹内
输入 npm config ls 查找 prefix路径
在命令行输入 npm config set prefix "D:\program\nvm\node.js"，再输入npm config ls查找
重启vscode 就会发现好了

PowerShell无法使用

在这里插入图片描述

以管理员身份打开PowerShell。
执行以下命令来查看当前的执行策略

Get-ExecutionPolicy

在这里插入图片描述
3. 如果返回结果是Restricted，你需要设置一个更宽松的执行策略。可以选择RemoteSigned，这样只有本地脚本和经过签名的远程脚本会被允许执行

Set-ExecutionPolicy RemoteSigned

如果还不行执行此命令

Set-ExecutionPolicy -Scope CurrentUser

接着输入 RemoteSigned

5. 验证一下命令行输入get-ExecutionPolicy 返回RemoteSigned就成功了