【简明图文教程】Node.js的下载、安装、环境配置及测试
创始人
2024-12-17 22:08:49
0

文章目录

    • 前言
    • 下载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项目(超详细图解)

相关内容

热门资讯

相较于以往!越乡游义乌辅助器,... 相较于以往!越乡游义乌辅助器,WePoKer辅助器,绝活教程(有挂工具)-哔哩哔哩1、不需要AI权限...
透视脚本!微乐小程序免费黑科技... 透视脚本!微乐小程序免费黑科技,微乐小程序透视挂(透视)好像真的是有挂(有挂实锤)-哔哩哔哩破解侠是...
透视详细!微乐小程序黑科技(外... 透视详细!微乐小程序黑科技(外挂),微信小程序微乐跑得快技巧,教程妙招(揭秘有挂)-哔哩哔哩1、破解...
现就发布提示!微乐小程序黑科技... 现就发布提示!微乐小程序黑科技,微信小程序微乐陕西挖坑辅助(作弊器)方针教程(果然有挂)该软件可以轻...
不少玩家反映!星悦辅助干什么的... 不少玩家反映!星悦辅助干什么的,雀神麻雀科技公司,教材教程(有挂功能)-哔哩哔哩1、该软件可以轻松地...
透视新版!微乐小程序免费黑科技... 透视新版!微乐小程序免费黑科技,微乐小程序黑科技免费(透视)确实有挂(讲解有挂)-哔哩哔哩透视新版!...
透视开挂!微乐小程序免费黑科技... 您好,这款游戏可以开挂的,确实是有挂的,需要了解加去威信【485275054】很多玩家在这款游戏中打...
针对!微乐小程序免费黑科技,微... 针对!微乐小程序免费黑科技,微信微乐辅助免费(作弊器)项目教程(果然有挂)1、模拟器是什么优化,俱乐...
无独有偶!填大坑小程序辅助器,... 无独有偶!填大坑小程序辅助器,wepoker怎么获得好牌,教程书教程(发现有挂)-哔哩哔哩该软件可以...
透视辅助!微乐小程序黑科技,微... 透视辅助!微乐小程序黑科技,微乐小程序存在有挂(透视)好像真的是有挂(有挂规律)-哔哩哔哩1、免费脚...