【简明图文教程】Node.js的下载、安装、环境配置及测试

文章目录

    • 前言
    • 下载Node.js
    • 安装Node.js
    • 配置Node.js
    • 配置环境变量
    • 测试
    • 后言

前言

本教程适用于小白第一次从零开始进行Node.js的下载、安装、环境配置及测试。

如果你之前已经安装过了Node.js或删除掉了Node.js想重新安装,需要先参考以下博客进行处理后,再根据本文进行Node.js的下载、安装、环境配置及测试。

参考文章:彻底删除和重新安装Node.js


下载Node.js

(1)下载网址

Node.js中文网(https://www.nodejs.com.cn/download.html)

(2)选择对应系统的版本
在这里插入图片描述


安装Node.js

  • 双击安装包
    在这里插入图片描述
  • 一路【next】
    记住自己的安装目录路径(建议默认路径,不要更改,方便下面的环境变量配置)。
    默认的安装路径为:C:\Program Files\nodejs\
  • 点击【Install】,等待安装
  • 点击【Finish】完成安装

配置Node.js

主要配置npm全局模块的安装路径以及缓存cache的路径。如果不配置的话,默认【npm install 模块名 -g】是安装到【C:\Users\用户名\AppData\Roaming\npm】路径中,而此处希望将全局模块和缓存路径放到Node.js的安装目录下【C:\Program Files\nodejs】。

(1)在Node.js的安装目录下创建文件夹【node_global】和【node_cache】

在这里插入图片描述
(2)打开cmd命令提示符窗口,分别执行以下两个命令:

npm config set prefix "C:\Program Files\nodejs\node_global"
npm config set cache "C:\Program Files\nodejs\node_cache"

在这里插入图片描述


配置环境变量

(1)依次执行【此电脑】-->【右键】-->【属性】-->【高级系统设置】-->【高级】-->【环境变量】,打开环境变量设置窗口

(2)配置系统变量

  • 在【系统变量】中点击【新建】
    在这里插入图片描述

  • 输入变量名和变量值
    变量名:NODE_PATH
    变量值:C:\ProgramFiles\nodejs\node_global\node_modules
    在这里插入图片描述

  • 打开文件夹【node_global】,查看是否有多出了一个【node_modules】文件夹
    在这里插入图片描述
    注:如果 文件夹【node_global】里没有出现 【node_modules】文件夹,则在【node_global】下手动创建一个【node_modules】文件夹,再复制你创建的【node_modules】文件夹的路径地址到变量值。
  • 在【系统变量】中选择【Path】点击【编辑】添加【NODE_PATH】,随后一直点击【确定】
    在这里插入图片描述
    在这里插入图片描述

(2)配置用户变量

  • 在【用户变量】中点击【新建】
    在这里插入图片描述
    变量名:NODE_PATH
    变量值:C:\ProgramFiles\nodejs\node_global\node_modules
    在这里插入图片描述

  • 编辑【用户变量】中的【Path】
    在这里插入图片描述

  • 删除默认的 C 盘下的【C:\Users\mks\AppData\Roaming\npm】
    如果在你编辑【用户变量】中的【Path】中出现了【C:\Users\mks\AppData\Roaming\npm】,则需要进行删除。
    在这里插入图片描述

  • 在【用户变量】中选择【Path】点击【编辑】,添加【C:\Program Files\nodejs\node_global】的路径,点击确定
    在这里插入图片描述

测试

(1)赋予【node_global】和【node_cache】文件夹权限
步骤如下:
鼠标右击【node_global】的文件夹–>点击【属性】–>点击【安全】,–>点击【编辑】–>将权限都勾上–>点击【确定】。【node_cache】步骤同理。
在这里插入图片描述
(2)在cmd中使用以下命令下载 express 模块

npm install -g express

注:-g 代表全局安装。

出现以下界面即为配置成功
在这里插入图片描述
在这里插入图片描述


(3)在cmd中分别输入以下命令查看node和npm版本

node -v
npm -v

在这里插入图片描述


后言

如果你看到了这里,那么恭喜你成功安装了Node.js,可以开心地去跑你的Vue项目了。

如何运行Vue项目可参考以下博客:
如何运行vue项目(超详细图解)

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

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

相关文章

HarmonyOS实战开发-图片编辑、使用 TextArea 实现多文本输入

介绍 本示例使用 TextArea 实现多文本输入,使用 ohos.app.ability.common 依赖系统的图库引用,实现在相册中获取图片,使用 ohos.multimedia.image 生成pixelMap,使用pixelMap的scale(),crop(),rotate()接口…

学习云计算HCIE选择誉天有什么优势?

誉天云计算课程优势实战性强 课程注重实践操作,通过实际案例和实验操作,让学员深入了解云计算的应用场景和实际操作技能。课程内容全面 涵盖所有云计算涉及的IT基础知识、服务器、存储、网络等方面的基础知识,开源操作系统Linux,开…

HarmonyOS实战开发-拼图、如何实现获取图片,以及图片裁剪分割的功能。

介绍 该示例通过ohos.multimedia.image和ohos.multimedia.mediaLibrary接口实现获取图片,以及图片裁剪分割的功能。 效果预览 使用说明: 使用预置相机拍照后启动应用,应用首页会读取设备内的图片文件并展示获取到的第一个图片,…

【muzzik 分享】3D模型平面切割

# 前言 一年一度的征稿到了,倒腾点存货,3D平面切割通常用于一些解压游戏里,例如水果忍者,切菜这些,今天我就给大家讲讲怎么实现3D切割以及其原理,帮助大家更理解3D中的 Mesh(网格),以及UV贴图和…

机器学习和深度学习--李宏毅(笔记与个人理解)Day11-12

Day11 when gradient is small…… 怎么知道是局部小 还是鞍点? using Math 这里巧妙的说明了hessan矩阵可以决定一个二次函数的凹凸性 也就是 θ \theta θ 是min 还是max,最后那个有些有些 哈 是一个saddle; 然后这里只要看hessan矩阵是不…

Element-UI 下拉框单选转多选回显不清空绑定的值

需求 根据radio切换来更改下拉框是否多选 原因 单选和多选这两个 input 看上去没差别&#xff08;自身和层级都一致&#xff09;&#xff0c;vue出于提高性能&#xff0c;所以 vue 给复用了 解决方案 <template><section><el-radio-group v-model"radi…

风储微网虚拟惯性控制系统simulink建模与仿真

目录 1.课题概述 2.系统仿真结果 3.核心程序与模型 4.系统原理简介 5.完整工程文件 1.课题概述 风储微网虚拟惯性控制系统simulink建模与仿真。风储微网虚拟惯性控制系统是一种模仿传统同步发电机惯性特性的控制策略&#xff0c;它通过集成风力发电系统、储能系统和其他分…

聚丙烯PP它的化学特性是什么? UV胶水能够粘接聚丙烯PP吗?

聚丙烯PP它的化学特性是什么? UV胶水能够粘接聚丙烯PP吗&#xff1f; 聚丙烯&#xff08;Polypropylene&#xff0c;简称PP&#xff09;是一种热塑性聚合物&#xff0c;属于聚烯烃类塑料之一。以下是聚丙烯的一些化学特性&#xff1a; 1. 分子结构&#xff1a; 聚丙烯是由丙烯…

再说vue响应式数据

请说一下你对响应式数据的理解 如何实现响应式数据据 对象 vue2 响应式核心代码 数组 vue2 处理缺陷Vue3则采用 proxy - vue3 响应式核心代码 请说一下你对响应式数据的理解 如何实现响应式数据据 数组和对象类型当值变化时如何劫持到。 对象 对象内部通过defineReactive方…

如何将普通maven项目转为maven-web项目

文件-项目结构&#xff08;File-->Project Structure &#xff09; 模块-->learn&#xff08;moudle-->learn&#xff09; 选中需要添加web的moudle&#xff0c;点击加号&#xff0c;我得是learn&#xff0c;单击选中后进行下如图操作&#xff1a; 编辑路径 结果如下…

Centos7 k8s 集群 - Rook Ceph 安装

环境准备 基础环境 系统名称操作系统CPU内存硬盘Kubernete 版本Docker版本IPmasterCentos74c4gsdb 20G1.17.023.0.1192.168.1.128node01Centos74c4gsdb 20G1.17.023.0.1192.168.1.129node02Centos74c4gsdb 20G1.17.023.0.1192.168.1.130node03Centos74c4gsdb 20G1.17.023.0.1…

OpenHarmony4.0分布式任务调度浅析

1 概述 OpenHarmony 分布式任务调度是一种基于分布式软总线、分布式数据管理、分布式 Profile 等技术特性的任务调度方式。它通过构建一种统一的分布式服务管理机制&#xff0c;包括服务发现、同步、注册和调用等环节&#xff0c;实现了对跨设备的应用进行远程启动、远程调用、…

3d怎么按路径制作模型---模大狮模型网

在3D建模中&#xff0c;按路径制作模型是一种常见的技术&#xff0c;特别适用于创建曲线、管道、绳索等线性形状的物体。虽然这项技术可能对初学者来说有些复杂&#xff0c;但通过一步步的指导和实践&#xff0c;你将能够掌握它。本文将详细介绍按路径制作模型的步骤&#xff0…

OpenDDS-3.27构建与用法

一、OpenDDS-3.27构建 ./configure To enable Java bindings, use ./configure --java make 二、运行Messenger Example&#xff1a; source setenv.sh For the C example&#xff1a;cd DevGuideExamples/DCPS/Messenger For the Java example&#xff1a;cd java/tests/mes…

【JVM】JVM堆占用情况分析(频繁创建的对象、内存泄露等问题)、jmap+jhat、jvisualvm工具使用

文章目录 一. 相关命令1. 查看进程堆内存整体使用情况&#xff1a;OOM的可能2. 统计类的对象数量以及内存占用&#xff1a;定位内存泄漏 二. 分析内存占用1. 使用 jhat 排查对象堆占用情况1.1. 排查步骤1.2. 具体分析例子a. 分析频繁创建对象导致的OOM 1.3. OQL查看某一个对象的…

Python 基于 OpenCV 视觉图像处理实战 之 OpenCV 简单视频处理实战案例 之十 简单视频浮雕画效果

Python 基于 OpenCV 视觉图像处理实战 之 OpenCV 简单视频处理实战案例 之十 简单视频浮雕画效果 目录 Python 基于 OpenCV 视觉图像处理实战 之 OpenCV 简单视频处理实战案例 之十 简单视频浮雕画效果 一、简单介绍 二、简单视频浮雕画效果实现原理 三、简单视频浮雕画效果…

关于MCU产品开发参数存储的几种方案

关于MCU产品开发参数存储的几种方案 Chapter1 关于MCU产品开发参数存储的几种方案Chapter2 单片机参数处理[保存与读取]Chapter3 嵌入式设备参数存储技巧Chapter4 STM32硬件I2C的一点心得(AT24C32C和AT24C64C) Chapter1 关于MCU产品开发参数存储的几种方案 原文链接 在工作中…

Python 批量检测ip地址连通性,以json格式显示(支持传参单IP或者网段)

代码 ########################################################################## File Name: check_ip_test.py# Author: eight# Mail: 18847097110163.com # Created Time: Thu 11 Apr 2024 08:52:45 AM CST################################################…

突破界限 千视将在 NAB 2024 展会上展示领先的 AV over IP 技术

突破界限&#xff01;千视将在 NAB 2024 展会上展示领先的 AV over IP技术 作为AV over IP领域的先驱者&#xff0c;Kiloview将于2024年4月14日至17日在NAB展会&#xff08;展台号&#xff1a;SU6029&#xff09;隆重登场&#xff0c;展示我们领先业界的AV over IP产品、解决方…

Windows下安装GPU版Pytorch

升级Driver到最新版本 Windows搜索栏中输入设备管理器找到显示适配器一项&#xff0c;点击展开&#xff0c;你将看到你的NVIDIA显卡列在其中右键点击你的NVIDIA显卡&#xff0c;选择更新驱动软件…。在弹出的对话框中&#xff0c;选择自动搜索更新的驱动软件。之后&#xff0c…