2024最新版Node.js下载安装及环境配置教程(非常详细)

一、进入官网地址下载安装包

官网:Node.js — Run JavaScript Everywhere 

其他版本下载:Node.js — Download Node.js® (nodejs.org)

选择对应你系统的Node.js版本

二、安装程序

(1)下载完成后,双击安装包,开始安装Node.js

 

  (2)直接点【Next】按钮,此处可根据个人需求修改安装路径,我这里路径改为了D:\Program Files\nodejs\,修改完毕后继续点击【Next】按钮

(3)可根据自身需求进行,此处我选择默认安装,继续点击【Next】按钮

(4)不选中,直接点击【Next】按钮

(5)点击【Install】按钮进行安装

(6)安装完毕,点击【Finish】按钮

(7)测试安装是否成功,按下【win+R】键,输入cmd,打开cmd窗口 ,输入:

node -v     // 显示node.js版本
npm -v      // 显示npm版本

成功显示版本说明安装成功 

三、环境配置

(1)找到安装的目录 D:\Program Files\nodejs,在安装目录下新建两个文件夹【node_global】和【node_cache】

(2)创建完毕后,使用管理员身份打开cmd命令窗口,这里以win11打开cmd为例,搜索框搜索cmd

(3)命令窗口输入以下命令

①npm config set prefix “你的路径\node_global” (复制你刚刚创建的“node_global”文件夹路径)

npm config set prefix "D:\Program Files\nodejs\node_global"


②npm config set cache “你的路径\node_cache” (复制你刚刚创建的“node_cache”文件夹路径)

npm config set cache "D:\Program Files\nodejs\node_cache"

(4)配置环境变量

①【此电脑】-单击右键-【属性】-【高级系统设置】-【环境变量】

② 在【系统变量】中点击【新建】

变量名:NODE_PATH

变量值:D:\Program Files\nodejs\node_global\node_modules

然后你就会发现【node_global】里多出了一个【node_modules】文件夹

Tips: 如果输入变量值之后没有自动创建【node_modules】文件夹,就在【node_global】下手动创建一个【node_modules】文件夹,再复制你创建的【node_modules】文件夹的路径地址到变量值

③编辑【用户变量】中的【Path】

④将默认的 C 盘下【 AppData\Roaming\npm 】修改成 【node_global】的路径,点击确定

修改前: 

修改后:

⑤在【系统变量】中选择【Path】点击【编辑】添加【NODE_PATH】,随后一直点击【确定】

四、测试

配置完成后进行测试,测试之前首先检查下,刚才的配置是否正确。

npm config get prefix
npm config get cache

 全局安装一个最常用的 express 模块进行测试

npm install express -g   // -g代表全局安装

出现以下界面即为配置成功

五、安装淘宝镜像

①安装淘宝镜像

npm config set registry https://registry.npm.taobao.org

查看是否成功:

npm config get registry

如果要恢复npm默认镜像,输入以下命令

npm config set registry https://registry.npmjs.org

②安装cnpm(按需安装)

说明: npm是node官方的包管理器。cnpm是个中国版的npm,是淘宝定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm。

npm install -g cnpm --registry=https://registry.npmmirror.com

查看是否安装成功

命令: cnpm -v

附加:如果有出现问题的小伙伴们可以检查一下自己的配置有没有出错,比如“系统找不到‘cnpm’命令 

六、安装失败检查

①打开cmd敲以下命令检查

npm config get prefix
npm config get cache

②打开环境变量配置检查

 

 ③打开安装目录检查是否有以下文件夹

⑤检查【node_global】里是否有【node_modules】文件夹 

⑥上面所安装的cnpm、express会出现在【node_global】下的【node_modules】文件夹里 

 七、 idea配置npm

1.找到Terminal-Shell path

重启IDEA后,执行npm install 需要在前端文件夹里面执行 

在执行npm run serve启动即可 

然后访问上边的地址就是项目首页;
如果需要打包,执行命令:
npm run build 

八、npm命令

1.清除npm缓存

npm cache clean -force

2.重新安装依赖

npm install

3.最后运行项目

npm run serve

4.打包

npm run build:pro

5.降级

举例:降级到6

# @后跟版本号,若跟的是大版本,则更新到对应大版本最新的小版本
npm install npm@6 -g
# 更新到指定版本
npm install npm@8.5.5 -g

6.升级

# 更新到最新版本
npm install npm -g

九、idea配置快速启动 

 1、启动配置点击编辑

2、添加npm 

3、填写相关信息 

4、快速启动 

十、启动vue项目失败问题

1. 运行前端脚手架工程报错: ‘vue-cli-service‘ 不是内部或外部命令,也不是可运行的程序 或批处理文件。

遇到该情况的原因有三个,第一个就是要在我们工程的 package.json 配置文件中查看是否有 vue-cli-server,如果没有则需安装,第二个是因为缺少 node_modules 模块,第三就是网络不稳定导致运行下载时包缺失。

1-1、 如果 package.json 配置没有 vue-cli-server 那么就安装它即可,注意安装完毕需重启编辑器启动项目,避免依赖添加不生效问题 

npm i -D @vue/cli-service

 1-2、如果 package.json 配置有 vue-cli-server 或者安装了还是没好,可以看看 node_modules 工程模块是否存在,如果没有请安装。
        一般负责前端工程的弟兄在给你项目的时候,会考虑到工程存储较大,为了方便传输会优化删掉 node_modules 模块然后发布到云端,这就像后端传输工程把 target 清掉是一个道理,所以没有的话是需要添加的。

在项目工程目录执行命令:

npm install

1-3、 如果上面两个条件都存在,却还是不行,那就是网络不稳定导致运行下载时包缺失,可以清掉 node_modules 后再次安装,我有4种方式,可以根据需求来
        (1)在打开cmd进入项目目录执行 rd /s /q node_modules

rd /s /q node_modules

        (2)PowerShell 或 git bash 进入控制台命令 rm -rf ./node_modules ,Linux通用

rm -rf ./node_modules

        (3) 用npm的rimraf工具来删,工具很小,删的很快,Linux通用

#添加 rimraf 工具
npm install rimraf -g
 
#命令删除
rimraf node_modules

        (4)扫描删除目录中所有能找到的 node_modules 文件夹

        注意!这个步骤会删除所有名字为 node_modules 的文件夹,而且不可逆,慎用,如果用了,以后在开电脑上的脚手架工程都要重新下载 node_modules

#Windows:
FOR /d /r . %d in (node_modules) DO @IF EXIST "%d" rm -rf "%d"
 
#linux
find . -name "node_modules" -type d -prune -exec rm -rf '{}' +

 2.项目执行 npm install 命令报错:failed, reason: certificate has expired

证书过期

原因:淘宝镜像源改变

解决方式:

2-1.更换淘宝镜像源

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

清除npm缓存

npm cache clean --force

2-2.如果已经安装过cnpm命令,则使用 cnpm install 命令 

3.报错: failed, reason: unable to get local issuer certificate

原因:无法获取本地颁发者证书,http请求https会报SSL的错误

取消ssl的校验

npm config set strict-ssl false

安装成功 

4.报错:EPERM:operation not permitted,mkdir‘xxxxxxxxxxxxxxxx‘ 

 

原因:node_models没有写权限

解决方法:给文件夹赋权

步骤:

4-1.找到nodejs安装目录 D:\Program Files\nodejs,

4-2.鼠标右击【node_global】的文件夹,点击【属性】,再点击【安全】,选择当前用户,再点击【编辑】,选择当前用户,在【完全控制】后打勾或者是将权限都勾上,随即点击【确定】即可。

4-3.【node_cache】步骤同理。

 

4-4.再次执行命令 npm install   

总结:以上任意步骤处理完,都最好重启编辑器后,重新启动项目

 

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

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

相关文章

OpenGL Super Bible 7th-Primitives, Pipelines, and Pixels图元、渲染管线与像素

简介 本文的原版为《OpenGL Super Bible 7th》,是同事给我的,翻译是原文+译文的形势。文章不属于机器直译,原因在于语言不存在一一对应的关系,我将尽可能的按照中国人看起来舒服的方式来翻译这些段子,如果段子让你感到身心愉悦,那还劳烦点个关注,追个更。如果我没有及时…

从0进入微服务需要了解的基础知识

文章目录 系统架构演化过程为什么要了解系统架构的演化过程技术发展认知技术选型与创新 演变过程单体架构分层-分布式集群微服务 分布式\集群\微服务 微服务中的核心要素-拆分原则项目拆分与复杂度微服务的拆分维度有哪些小结 微服务中的核心要素服务化进行拆分后一定是微服务&…

MFC扩展库BCGControlBar Pro v35.0新版亮点:重新设计的工具栏编辑器等

BCGControlBar库拥有500多个经过全面设计、测试和充分记录的MFC扩展类。 我们的组件可以轻松地集成到您的应用程序中,并为您节省数百个开发和调试时间。 BCGControlBar专业版 v35.0已全新发布了,这个版本改进类Visual Studio 2022的视觉主题、增强对多个…

ChatGPT付费创作系统V3.0.2独立版 WEB+H5+小程序端 (H5端界面美化+Pika视频作品广场+SunoAI 文生歌)系统部署教程

播播资源GPT付费体验系统最新版系统是一款基于ThinkPHP框架开发的AI问答小程序,是基于国外很火的ChatGPT进行开发的Ai智能问答小程序。当前全民热议ChatGPT,流量超级大,引流不要太简单!一键下单即可拥有自己的GPT!无限…

MinIO Enterprise Cache:实现超性能的分布式 DRAM 缓存

随着计算世界的发展和 DRAM 价格的暴跌,我们发现服务器配置通常配备 500GB 或更多的 DRAM。当您处理大型部署时,即使是那些具有超高密度 NVMe 驱动器的部署,这些服务器上的服务器数量乘以 DRAM 也会迅速增加,通常达到几 TB。该 DR…

【Intel CVPR 2024】通过图像扩散模型生成高质量360度场景,只需要一个语言模型

在当前人工智能取得突破性进展的时代,从单一输入图像生成全景场景仍是一项关键挑战。大多数现有方法都使用基于扩散的迭代或同步多视角内绘。然而,由于缺乏全局场景布局先验,导致输出结果存在重复对象(如卧室中的多张床&#xff0…

Android网络性能监控方案 android线上性能监测

1 Handler消息机制 这里我不会完整的从Handler源码来分析Android的消息体系,而是从Handler自身的特性引申出线上卡顿监控的策略方案。 1.1 方案确认 首先当我们启动一个App的时候,是由AMS通知zygote进程fork出主进程,其中主进程的入口就是Ac…

.Net OpenCVSharp生成灰度图和二值图

文章目录 前言一、灰度图二、二值图 前言 使用OpenCVSharp生成图片的灰度图和二值图 .Net 8.0版本,依赖OpenCvSharp4和OpenCvSharp4.runtime.win组件。 原图: 提示:以下是本篇文章正文内容,下面案例可供参考 一、灰度图 /// &…

【2024最新华为OD-C/D卷试题汇总】[支持在线评测] 内存访问热度分析(100分) - 三语言AC题解(Python/Java/Cpp)

🍭 大家好这里是清隆学长 ,一枚热爱算法的程序员 ✨ 本系列打算持续跟新华为OD-C/D卷的三语言AC题解 💻 ACM银牌🥈| 多次AK大厂笔试 | 编程一对一辅导 👏 感谢大家的订阅➕ 和 喜欢💗 &#x1f…

Proteus8.13安装及使用

Proteus安装包下载地址 具体安装方法如下: 退出所有杀毒软件,右键以管理员身份运行 如果缺插件安装插件然后点击安装 如果遇到这种需要勾选的都勾选 安装插件完成 安装过程: 安装完成后桌面会自动出现图标 注意这个安装包是免破解的, 安装好以后可以直接使用 打…

竞赛选题 LSTM的预测算法 - 股票预测 天气预测 房价预测

0 简介 今天学长向大家介绍LSTM基础 基于LSTM的预测算法 - 股票预测 天气预测 房价预测 这是一个较为新颖的竞赛课题方向,学长非常推荐! 🧿 更多资料, 项目分享: https://gitee.com/dancheng-senior/postgraduate 1 基于 Ke…

React+TS前台项目实战(十一)-- 全局常用组件提示语可复制Link组件封装

文章目录 前言HighLightLink组件1. 功能分析2. 代码详细注释3. 使用方式4. 效果展示 总结 前言 今天这篇讲的这个组件,是一个用于高亮显示文本并添加可选的跳转链接,提示文本,复制文本的 React 组件 HighLightLink组件 1. 功能分析 &#x…

SmartEDA、Multisim、Proteus大比拼:电路设计王者之争?

在电路设计领域,SmartEDA、Multisim和Proteus无疑是三款备受瞩目的软件工具。它们各自拥有独特的功能和优势,但在这场电路设计王者的竞争中,谁才是真正的领跑者?让我们深入探究这三款软件的异同,揭示它们各自的魅力所在…

【ComfyUI】Stable Diffusion 3 加Controlnet

基于 instantX-research/diffusers_sd3_control: 🤗 Diffusers: State-of-the-art diffusion models for image and audio generation in PyTorch and FLAX. (github.com) 和 ZHO-ZHO-ZHO/ComfyUI-SD3-Medium-CN-Diffusers: ComfyUI SD3-Medium ControlNet&#…

JRebel-JVMTI [FATAL] Couldn‘t write to C:\Users\中文用户名-完美解决

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 热部署下载参考博客解决第一步第二步第三步:第四步: 热部署下载 下载后启动报错:JRebel-JVMTI [FATAL] Couldn’t write to C:\…

WebSocket实现消息实时通知

参考文档:万字长文,一篇吃透WebSocket:概念、原理、易错常识、动手实践、WebSocket 教程 1 背景 有一个需求,需要实现实时通信的功能,如果有新消息,后端会主动发送请求告知前端有新消息,需要前…

git Fork或者git clone克隆别人的项目到自己的仓库如何保持原仓库同步

一、问题描述 有时候我们会clone别人的项目到自己的仓库来进行二次开发,开发好之后提交到自己的仓库,如有原仓库有更新了,可以选择性的进行同步 二、解决方法 这里以ruoyi-vue-pro得前端项目来进行演示,创建一个目录,在目录下随便创建一个文…

入门Rabbitmq

1、什么是消息队列 消息队列:应用之间传递消息的方式,允许应用程序异步发送和接收消息,不需要连接对方 消息:文本字符串,对象.... 队列:存储数据。先进先出 2、应用场景 ①库存系统挂掉之后 MQ会等待&…

Ubuntuwin11双系统

一、准备工作 win11与ubuntu20.4双系统安装案例教程,先查看引导模式参数不服则不要安装否则会报异常 查看BIOS引导模式 查看磁盘分区格式 下载Ubuntu镜像 所有版本下载地址,我的华为云镜像ubuntu20.4这个版本地址

Hi3861 OpenHarmony嵌入式应用入门--启动流程

目录 BootLoader的启动与运行 Hi3861 RiSC-V boot 启动文件介绍 Loaderboot 启动过程 Flashboot代码介绍 printf串口配置 内核启动任务 BootLoader的启动与运行 Hi3861 RiSC-V boot 启动文件介绍 - Hi3861 的引导程序分为两部分,一部分是在芯片出厂时已经固…