node.js环境搭建图文详解


Posted in Javascript onSeptember 19, 2018

身为一名Java开发者对前端充满无限的好奇,于是开始踏入前端的领地。要想先学习,搭建环境是必备,所以整理一篇node.js环境搭建教程。

Node.js 是一个让 JavaScript 运行在服务端的开发平台

官网https://nodejs.org

下载

下载地址https://nodejs.org/en/download/

node.js环境搭建图文详解

本次下载LTS长期支持版,.zip解压版本(当然也可以使用安装版.msi),点击右侧[64-bit]即可下载.

解压

解压到自己所要存放的文件夹中,如图:
node.js环境搭建图文详解

解压完成后会有node-v8.12.0-win-x64文件夹

配置环境变量

[我的电脑]-右键->[属性]-左侧->[高级系统设置]-下侧->[环境变量]

图示:

node.js环境搭建图文详解
node.js环境搭建图文详解
node.js环境搭建图文详解
node.js环境搭建图文详解

想要在cmd黑窗口中使用node命令,需要在path中加入node安装路径,点击编辑按钮,新增node安装路径。
以下是win10的界面,点击编辑文本按钮即可切换至和win7一样的界面。

node.js环境搭建图文详解
node.js环境搭建图文详解

D:\aqqaz\dev\node\node-v8.12.0-win-x64 是我的安装目录,请换成自己的目录!!!!!!

或者 在编辑框中加上,对应自己的node路径

;D:\aqqaz\dev\Java\jdk1.8.0_181\bin;
这样node.js基本环境就配置完成

测试node环境

快捷键win+R,输入cmd,点击确定按钮

node.js环境搭建图文详解
node.js环境搭建图文详解

输入node -v

返回node版本

输入npm -v

返回npm版本

表示环境变量配置成功

此处说明下:新版的Node.js已自带npm,安装Node.js时会一起安装,npm的作用就是对Node.js依赖的包进行管理,也可以理解为用来安装/卸载Node.js需要装的东西.

配置环境变量(npm)

此处主要配置的是npm安装的全局模块所在的路径和缓存cache的路径,因为在以后使用node.js的时候会经常使用nmp命令来下载包,比如npm install express [-g] (后面的可选参数-g,g代表global全局安装的意思)的安装语句时,会将安装的模块安装到【C:\Users\用户名\AppData\Roaming\npm】路径中,占C盘空间.

在安装node的目录下,node-v8.12.0-win-x64下新建文件夹node_cache和node_global

node_cache存放缓存,node_global下载的包

如图

node.js环境搭建图文详解

然后,在node中设置,win+R 运行cmd,进入黑窗口。

输入

npm config set prefix "D:\aqqaz\dev\node\node-v8.12.0-win-x64\node_global"

回车

npm config set cache "D:\aqqaz\dev\node\node-v8.12.0-win-x64\node_cache"

D:\aqqaz\dev\node\node-v8.12.0-win-x64 是我的安装目录,请换成自己的目录!!!!!!

node.js环境搭建图文详解

在环境变量中新建,添加变量名【NODE_PATH】,变量值【D:\aqqaz\dev\node\node-v8.12.0-win-x64\node_global\node_modules】,确定
D:\aqqaz\dev\node\node-v8.12.0-win-x64 是我的安装目录,请换成自己的目录!!!!!!

node.js环境搭建图文详解

在【Path】中新增D:\aqqaz\dev\node\node-v8.12.0-win-x64\node_global

node.js环境搭建图文详解

更换淘宝镜像

使用nmp下载包的时候,很多包都是国外的,所以配置镜像会比较快,

查看当前使用的镜像地址,在黑窗口输入npm get registry

返回> https://registry.npmjs.org/

更换成阿里的镜像,在黑窗口输入npm config set registry http://registry.npm.taobao.org/

如图

node.js环境搭建图文详解

测试

安装个module测试下,我们就安装最常用的express模块,打开cmd窗口,

输入如下命令进行模块的全局安装:

npm install express -g # -g是全局安装的意思

node.js环境搭建图文详解

安装成功

D:\aqqaz\dev\node\node-v8.12.0-win-x64\node_global\node_modules目录下会出现express文件夹

node.js环境搭建图文详解

总结

以上所述是小编给大家介绍的node.js环境搭建图文详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
深入理解Javascript里的依赖注入
Mar 19 Javascript
jquery实现带缩略图的可定制高度画廊效果(5种)
Aug 28 Javascript
js事件处理程序跨浏览器解决方案
Mar 27 Javascript
微信开发 微信授权详解
Oct 21 Javascript
AngularJS中的Promise详细介绍及实例代码
Dec 13 Javascript
AngularJS打开页面隐藏显示表达式用法示例
Dec 25 Javascript
js仿搜狐视频记录片列表展示效果
May 30 Javascript
jQuery实现的页面详情展开收起功能示例
Jun 11 jQuery
微信小程序实现自定义picker选择器弹窗内容
May 26 Javascript
JS Object.preventExtensions(),Object.seal()与Object.freeze()用法实例分析
Aug 25 Javascript
详解Vue项目部署遇到的问题及解决方案
Jan 11 Javascript
vue中node_modules中第三方模块的修改使用详解
May 31 Javascript
老生常谈JavaScript获取CSS样式的方法(兼容各浏览器)
Sep 19 #Javascript
vue生命周期和react生命周期对比【推荐】
Sep 19 #Javascript
Vue瀑布流插件的使用示例
Sep 19 #Javascript
vue-cli项目修改文件热重载失效的解决方法
Sep 19 #Javascript
解决vuecli3.0热更新失效的问题
Sep 19 #Javascript
记一次webapck4 配置文件无效的解决历程
Sep 19 #Javascript
解决vue热替换失效的根本原因
Sep 19 #Javascript
You might like
ECMall支持SSL连接邮件服务器的配置方法详解
2014/05/19 PHP
ThinkPHP3.1基础知识快速入门
2014/06/19 PHP
PHP+MySQL之Insert Into数据插入用法分析
2015/09/27 PHP
jquery 查找新建元素代码
2010/07/06 Javascript
JQuery给元素添加/删除节点比如select
2013/04/02 Javascript
JavaScript调用ajax获取文本文件内容实现代码
2014/03/28 Javascript
Javascript设计模式之观察者模式的多个实现版本实例
2015/03/03 Javascript
WordPress 单页面上一页下一页的实现方法【附代码】
2016/03/10 Javascript
BootStrap无限级分类(无限极分类封装版)
2016/08/26 Javascript
Vue2.0实现1.0的搜索过滤器功能实例代码
2017/03/20 Javascript
jQuery异步提交表单实例
2017/05/30 jQuery
浅谈vue-cli 3.0.x 初体验
2018/04/11 Javascript
vuex的module模块用法示例
2018/11/12 Javascript
原生javascript自定义input[type=radio]效果示例
2019/08/27 Javascript
vue实现在线预览pdf文件和下载(pdf.js)
2019/11/26 Javascript
解决vue的router组件component在import时不能使用变量问题
2020/07/26 Javascript
vue 判断元素内容是否超过宽度的方式
2020/07/29 Javascript
解决vue-router 嵌套路由没反应的问题
2020/09/22 Javascript
Python 过滤字符串的技巧,map与itertools.imap
2008/09/06 Python
Python open()文件处理使用介绍
2014/11/30 Python
Python初学时购物车程序练习实例(推荐)
2017/08/08 Python
Python3.6通过自带的urllib通过get或post方法请求url的实例
2018/05/10 Python
基于Python List的赋值方法
2018/06/23 Python
python进行TCP端口扫描的实现
2018/12/21 Python
python time.sleep()是睡眠线程还是进程
2019/07/09 Python
设置jupyter中DataFrame的显示限制方式
2020/04/12 Python
python实现文字版扫雷
2020/04/24 Python
Tensorflow使用Anaconda、pycharm安装记录
2020/07/29 Python
详解pycharm连接远程linux服务器的虚拟环境的方法
2020/11/13 Python
canvas学习和滤镜实现代码
2018/08/22 HTML / CSS
全球性的在线婚纱礼服工厂:27dress.com
2019/03/21 全球购物
实习单位接收函
2014/01/11 职场文书
学生会主席事迹材料
2014/01/28 职场文书
交通安全横幅标语
2014/10/07 职场文书
企业宣传稿范文
2015/07/23 职场文书
详解Nginx的超时keeplive_timeout配置步骤
2022/05/25 Servers