Angular进阶-NVM管理Node.js实现不同版本Angular环境切换

一、NVM介绍

1. NVM简介

Node Version Manager(NVM)是一个用于管理多个Node.js版本的工具。它允许用户在同一台机器上安装和使用多个Node.js版本,非常适合需要同时进行多个项目的开发者。NVM是开源的,支持MacOS、Windows和Linux操作系统。

2. NVM原理

NVM通过修改PATH环境变量,控制不同命令行会话中使用的Node.js版本。它不需要管理员权限,可以在用户的主目录中安装Node.js版本,并将它们隔离开来。通过执行简单的命令,用户可以选择正在使用的Node.js版本,这使得在不同版本之间切换变得非常简单。

3. NVM的优势

  • 版本管理灵活:允许在同一系统中安装多个Node.js版本,并能轻松切换。
  • 环境隔离:每个Node.js版本都在用户空间内独立安装,不会互相影响。
  • 无需管理员权限:用户可以在其主目录下安装和维护Node.js版本,无需管理员权限。
  • 支持自动切换:通过.nvmrc文件自动切换项目所需的Node.js版本。

二、常用Node.js版本对照

1. Node.js和Vue版本对照表

Vue.js 版本推荐 Node.js 版本兼容 TypeScript 版本
Vue 3.xNode.js 12 或更高TypeScript 3.9 或更高
Vue 2.6Node.js 10 或更高TypeScript 3.5 或更高
Vue 2.5Node.js 10TypeScript 2.6 或更高
Vue 2.4 及以下Node.js 8TypeScript 不推荐

注意:

  • Vue 3.x 被完全重写以支持 TypeScript,建议使用 TypeScript 3.9 或更高版本。
  • Vue 2.5 引入了对 TypeScript 的改进支持,推荐至少使用 TypeScript 2.6。
  • 较早的 Vue.js 版本(2.4 及以下)并没有针对 TypeScript 提供优化支持,在这些版本中使用 TypeScript 需要额外的配置,不推荐。

2. Node.js和Angular版本对照表

Angular作为一个更为严格的框架,其版本通常要求较新的Node.js版本。以下是Angular版本与Node.js版本的推荐对照表:

Angular 版本推荐 Node.js 版本兼容 TypeScript 版本
Angular 17.1.0^18.13.0 或 ^20.9.0>=5.2.0 < 5.4.0
Angular 17.0.x^18.13.0 或 ^20.9.0>=5.2.0 < 5.3.0
Angular 16.1.x^16.14.0 或 ^18.10.0>=4.9.3 < 5.2.0
Angular 16.2.x^16.14.0 或 ^18.10.0>=4.9.3 < 5.2.0
Angular 16.0.x^16.14.0 或 ^18.10.0>=4.9.3 < 5.1.0
Angular 15.1.x^14.20.0 或 ^16.13.0 或 ^18.10.0>=4.8.2 < 5.0.0
Angular 15.2.x^14.20.0 或 ^16.13.0 或 ^18.10.0>=4.8.2 < 5.0.0
Angular 15.0.x^14.20.0 或 ^16.13.0 或 ^18.10.0~4.8.2
Angular 14^14.15.0 或 ^16.10.0>=4.6.4 < 4.9.0
Angular 13^12.20.2 或 ^14.15.0 或 ^16.10.0>=4.4.4 < 4.7.0
Angular 12^12.14.1 或 ^14.15.0>=4.2.4 < 4.4.0
Angular 11^10.13.0 或 ^12.11.1>=4.0.8 < 4.2.0
Angular 10^10.13.0 或 ^12.11.1>=3.9.4 < 4.1.0
Angular 9^10.13.0 或 ^12.11.1>=3.6.5 < 3.9.0
Angular 8^10.9.0~3.4.5 或 ~3.5.3
Angular 7^8.9.4 或 ^10.9.0~3.1.6 或 ~3.2.4
Angular 6^8.9.4~2.7.2 或 ~2.9.2
Angular 5^6.9.5 或 ^8.9.4~2.5.3
Angular 4^6.9.5~2.4.2
Angular 2^6.9.5~2.0.10 或 ~2.2.2 或 ~2.3.4

3. Node.js和React版本对照表

React 版本推荐 Node.js 版本兼容 TypeScript 版本
React 18Node.js 14 或更高TypeScript 4.5 或更高
React 17Node.js 12 或更高TypeScript 4.1 或更高
React 16Node.js 10 或更高TypeScript 3.7 或更高
React 15Node.js 8TypeScript 2.8 或更高
React 0.14 及以下Node.js 6TypeScript 1.8 或更高

三、安装NVM步骤

1. 下载安装NVM

GitHub (https://github.com/coreybutler/nvm-windows/releases) 下载NVM。
在这里插入图片描述
下载完成后双击.exe安装程序安装。
在这里插入图片描述
选择NVM的安装路径和Node.js的安装路径,Node.js的安装路径是一个临时文件夹,在NVM的路径下有已安装的所有版本的Node.js,当我们选中应用哪个版本的Node.js时,Node.js的安装路径下变成哪一个版本的Node.js的复制。
在这里插入图片描述
继续安装。
在这里插入图片描述
安装完成。
在这里插入图片描述
通过运行nvm version来验证NVM是否正确安装。


2. 配置Node.js路径到环境变量

把我们刚刚安装NVM时选择的Node.js安装的路径写到path里。
在这里插入图片描述
在这里插入图片描述
这样我们才能在控制台直接使用npm命令。


3. NVM安装Node.js

我们先安装较新版本的Node.js 20.9.0。

   nvm install 20.9.0

在这里插入图片描述
切换当前版本为我们刚刚安装的Node.js 20.9.0。

	nvm use 20.9.0

再次检查一下是否为该版本。

	node -v

接着我们安装Angular 17。

	npm i -g @angular/cLi@17

在这里插入图片描述
安装成功。


4. NVM安装多版本Node.js

我们再安装18.10.0版本的Node.js。

   nvm install 18.10.0

在这里插入图片描述
这时候通过nvm list可以看到我们所有已经安装的Node.js的版本,通过 nvm use 18.10.0 可以灵活切换当前使用的版本。

	nvm list
	nvm use 18.10.0

在这里插入图片描述


5. NVM切换Node.js实现Angular多版本安装

下面我们切换Node.js版本为18.10.0,安装Angular 15。
在这里插入图片描述
安装成功。
可见,使用NVM进行Node.js的多版本控制与隔离,可以帮助我们在同一个操作系统里安装多个版本的Angular/Vue等前端库,以实现不同项目依赖的需求。


6. .nvmrc文件实现项目的自动版本控制

可以在项目根目录下创建一个名为 .nvmrc 的文件,文件内容是项目所需的 Node.js 版本号。
例如,如果你的项目需要 Node.js 版本 14.17.0,那么 .nvmrc 文件的内容应该是:

	14.17.0

当你进入项目目录时,可以运行以下命令来自动切换到 .nvmrc 文件指定的 Node.js 版本:

	nvm use

如果你的系统中尚未安装该版本的 Node.js,NVM 将提示你安装它。


四、NVM管理多版本Node.js教程总结

通过NVM(Node Version Manager),开发者可以非常灵活地管理不同的Node.js版本,以满足不同项目的需求。使用NVM,你可以避免版本冲突和环境污染问题,更高效地进行Node.js应用的开发和测试。通过理解和利用NVM的优点,你可以在现代Web开发中保持高效和竞争力。

NVM的核心功能允许你在同一台机器上安装和切换多个Node.js版本。这意味着你可以轻松测试你的应用在不同Node.js版本下的表现,确保应用的兼容性和稳定性。例如,如果一个老项目需要Node.js的早期版本而新项目需要最新版本,NVM使得在这两个版本之间切换变得无缝和简单。

此外,NVM还支持自动版本控制。通过在项目的根目录下放置一个 .nvmrc 文件,该文件指定了项目所需的Node.js版本,NVM可以自动切换到该版本。这使得团队成员在初次运行项目时能够自动使用正确的Node.js版本,降低了配置错误的风险。

NVM的安装和使用也非常直接。通过简单的命令行指令,你可以安装多个版本的Node.js,并通过命令快速切换当前使用的版本。NVM还提供了一些有用的命令来列出已安装的版本、安装新版本或删除旧版本,使得Node.js版本的管理更加直观和方便。

总之,NVM是每个Node.js开发者工具箱中的必备工具。它不仅提高了开发的灵活性和效率,还通过确保每个项目都使用合适的Node.js版本来增强了代码的可维护性和团队的协作效率。通过投入时间学习和掌握NVM,你可以确保自己在快速发展的技术环境中保持竞争力。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/593545.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

wechat_OCR项目打包以及如何使用

&#x1f4da;博客主页&#xff1a;knighthood2001 ✨公众号&#xff1a;认知up吧 &#xff08;目前正在带领大家一起提升认知&#xff0c;感兴趣可以来围观一下&#xff09; &#x1f383;知识星球&#xff1a;【认知up吧|成长|副业】介绍 ❤️感谢大家点赞&#x1f44d;&…

医学图像处理:nii格式转换(3D切片为2D)

目录 NIFTI文件结构 读取NII文件 ITK-SNAP安装 使用方法 NII转PNG NIFTI文件结构 NIFTI 格式&#xff0c;是一种用于存储和交换医学成像数据的文件格式&#xff0c;特别适用于神经影像学领域。NIFTI文件通常有两个扩展名&#xff1a;.nii&#xff08;用于图像数据&#xf…

42.WEB渗透测试-信息收集-域名、指纹收集(4)

免责声明&#xff1a;内容仅供学习参考&#xff0c;请合法利用知识&#xff0c;禁止进行违法犯罪活动&#xff01; 内容参考于&#xff1a; 易锦网校会员专享课 上一个内容&#xff1a;41.WEB渗透测试-信息收集-域名、指纹收集&#xff08;3&#xff09; 关于单域名收集内容…

基于JSP的酒店客房管理系统(二)

目录 第二章 相关技术介绍 2.1 Jsp的简介 2.2 sql server 2005 的简介 第三章 系统的分析与设计 3.1 系统需求分析 1&#xff0e;理解需求 2&#xff0e;需求分析 3.2开发及运行环境 3.3功能模块的设计 3.3.1 设计目标 3.3.2 客房管理系统前台的设计 3.3.3 操作员管…

一种算法分类方式及其应用

在计算机科学领域&#xff0c;算法是解决问题的有效方法&#xff0c;而对算法进行分类有助于理解它们的特性、优劣以及在不同场景下的应用。常见的算法分类方法&#xff0c;包括按设计思想、问题类型、数据结构和应用领域等&#xff0c;每一类算法会对应有其典型和实际应用。 算…

大数据BI可视化(Echarts组件)项目开发-熟悉交互API5.0

全局echarts对象 init初始化 registerTheme注册主题 var mCharts echarts.init(document.querySelector("div"), itcast)registerMap地图图表 connect 代码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8&qu…

javaFor循环-打印九九乘法表

虽然所有循环结构都可以用while或者do...while表示&#xff0c;但java提供了另一种循环语句--for循环&#xff0c;使一些循环结构变得简单。for循环语句是支持迭代的一种通用结构&#xff0c;是最有效&#xff0c;最灵活的循环结构。 先写第一列&#xff1a; 运行结果&#xf…

什么是开发者门户?最佳实践及示例

原文链接&#xff1a;https://document360.com/blog/api-developer-portal-examples 开发者门户是什么&#xff1f; DevPortal 奖的主要赞助商 Provonix 对开发者门户的定义如下&#xff1a; “开发者门户&#xff08;通常缩写为 DevPortal&#xff09;是一组 API、SDK 或其他…

【电机控制】七段式SVPWM扇区、矢量作用时间计算——对比simplefoc与Ti例程

【电机控制】七段式SVPWM扇区、矢量作用时间计算——对比simplefoc与Ti例程 文章目录 前言一、simplefoc——通过角度找扇区1.通过角度找扇区理论1.通过角度找扇区2.矢量作用时间计算3.矢量切换时间计算——七段式 2.simplefoc代码3.解读simplefoc代码1.通过角度找扇区2.矢量作…

关于YOLO8学习(四)模型转换为ncnn

前文 关于YOLO8学习(一)环境搭建,官方检测模型部署到手机 关于YOLO8学习(二)数据集收集,处理 关于YOLO8学习(三)训练自定义的数据集 简介 本文将会讲解: (1)如何通过PyCharm,进行pt模型的转换,最后输出一个适合手机端使用的模型 开发环境 win10、python 3.11…

[ARM系列]coresight(一)

原文链接 目的&#xff1a;对复杂SOC实现debug和trace的架构 典型环境 包含&#xff1a;2个ARM core&#xff0c;一个DSP&#xff0c;众多coresight组件 coresight组件实现对core、DSP的debug和trace功能 环境中包含3个通路 trace通路&#xff1a;将core和DSP内部信息输出到…

【机器学习-21】集成学习---Bagging之随机森林(RF)

【机器学习】集成学习---Bagging之随机森林&#xff08;RF&#xff09; 一、引言1. 简要介绍集成学习的概念及其在机器学习领域的重要性。2. 引出随机森林作为Bagging算法的一个典型应用。 二、随机森林原理1. Bagging算法的基本思想2. 随机森林的构造3. 随机森林的工作机制 三…

【C++】学习笔记——vector_3

文章目录 七、vector3. vector的模拟实现4. vector实现代码整合 未完待续 七、vector 3. vector的模拟实现 上篇文章我们讲解了非常 玄幻 的拷贝构造函数&#xff0c;同样的方法&#xff0c;我们也能用这种方法来实现 赋值重载函数 。 void swap(vector<T>& v) {s…

【Linux 网络】网络基础(一)(局域网、广域网、网络协议、TCP/IP结构模型、网络传输、封装和分用)-- 详解

一、计算机网络的发展背景 1、网络的定义 网络是指将多个计算机或设备通过通信线路、传输协议和网络设备连接起来&#xff0c;形成一个相互通信和共享资源的系统。 &#xff08;1&#xff09; 独立模式 独立模式 &#xff1a; 计算机之间相互独立。 &#xff08;2&#xff09;…

C语言二分查找的区间问题

概念 什么是二分查找呢&#xff1f; 二分查找&#xff1a;在有序数组中查找某一特定元素的搜索算法。 二分查找又称折半查找&#xff0c;通过将数组折半&#xff0c;用中间值和查找值作比较&#xff0c;多次使用&#xff0c;直到找到要查找的值。 注意:二分查找的前提是&#…

【xxl-job | 第二篇】Windows源码安装xxl-job

文章目录 2.Windows源码安装xxl-Job2.1拉取源码2.2IDEA导入2.3初始数据库数据2.4修改properties配置2.5启动admin并进入任务管理后台2.6jar包运行&#xff08;部署到Linux服务器上&#xff09;2.6.1打包2.6.2在xxl-job-admin打开jar包目录2.6.3cmd运行jar包 2.Windows源码安装x…

贪心,蓝桥杯真题 [巧克力]

一、题目 1、题目描述 2、输入输出 2.1输入 2.2输出 3、原题链接 2.巧克力 - 蓝桥云课 (lanqiao.cn) 二、解题报告 1、思路分析 做法&#xff1a;我们将巧克力按照价格升序排序&#xff0c;然后顺序枚举巧克力wi&#xff0c;查找小于等于bi的日期中最大的未被选择日期&…

代码审计之浅谈RASP技术

前言&#xff1a; 想摆会烂&#xff0c;所以就落个笔吧。 其实本来是想写关于iast技术的&#xff0c;但是认真思考了下&#xff0c;感觉笔者自己本身也不太能讲清楚iast技术&#xff0c;怕误人子弟。 所以最后还是基于笔者的理解以及实际应用写一篇关于RASP技术的文章&#xf…

使用memcache 和 redis 、 实现session 会话复制和保持

一、NoSQL介绍 NoSQL是对Not Only SQL、非传统关系型数据库的统称 NoSQL一词诞生于1998年&#xff0c;2009年这个词汇再次提出指非关系型、分布式、不提供ACID的数据库设计模式 随着互联网时代的数据爆发时增长、数据库技术发展的日新月异&#xff0c;要适应新的业务需求&am…

【网络通信】Windows搭建RTMP视频流服务器(含推流/拉流详细教程)

RTMP&#xff08;Real-Time Messaging Protocol&#xff09;是一种用于实时流媒体传输的网络协议&#xff0c;主要用于传输音频、视频和数据。RTMP最初是由Adobe Systems公司开发的&#xff0c;用于其Flash平台和Adobe Media Server&#xff0c;但随着技术的发展和开源社区的推…