进公司第三天,我打开项目竟然发生了这种事...(Node.js的安装配置)

77 阅读2分钟

今天是进公司的第三天,照往常一样我打开公司的项目去熟悉内容,当我打开前两天没看的web项目的时候竟然跳出来这个内容!!!(公司规定使用HBuilder X进行开发)

问题.png

作为前端开发,我的上一任开发竟然没有在电脑里面装node.js,打开项目的时候我都以为我自己打错开始怀疑自己了,既然如此我只能重新安装了。

下载Node.js

这里推荐选择第一个LTS(long time support) 长期支持版本,这个版本重点在于稳定性和安全性

点击前往node.js官网

node.png

安装Node.js

node.js的安装在确定好安装的目录之后只需要不停的next,直到finish就可以了,就可以进行下一步的环境变量的配置

配置环境变量

点击Windows键(或者用鼠标点击开始),在搜索框中输入,环境变量

环境变量.png

环境变量1.png

点击用户变量中点击新建输入内容(这里变量名不变变量值跟随你node安装的位置来确定

环境变量2.png

双击用户变量中的Path选择新建输入内容 %NODE_PATH%

环境变量3.png

检查

保存之后,打开终端输入

  • node -v (检查node是否安装成功)
  • npm -v
  • echo %PATH%(检查path路径是否正常)

环境变量4.png

到这里node就安装配置完成了。下面进行npm的配置

配置NPM

首先在node.js安装的目录中新建两个文件夹,npm全局模块下的存放文件夹cahce文件夹分别对应“node_global”、“node_cache”。

npm.png

修改npm的存储cache位置

查看存储位置
npm config get prefix 
设置存储位置
npm config set prefix "D:\nodejs\node_global"
查看cache位置
npm config get cache 
设置cache位置
npm config set cache "D:\nodejs\node_cache"

npm1.png

配置npm镜像站(修改为国内的npm镜像,下载速度更快)

修改为国内的淘宝镜像
npm config set registry=https://registry.npm.taobao.org
查看修改结果
npm config get registry

npm2.png

最后查看所有的配置信息

npm config list

npm4.png

Hbuilder X配置

使用指令

where node
where npm

获取node和npm的位置

where.png

使用快捷键 Ctrl + Alt + , 打开设置,选择运行配置,将获取的位置填进对应选项重启编辑器就可以了

hbuilderx.png

结束

到这里node.js的安装配置和npm的配置就全部结束了。