当前位置: 首页 > news >正文

搭建nodejs环境

        

目录

nodejs介绍

npm是什么

 配置环境变量 

 修改npm镜像提高下载速度

测试是否镜像配置成功

配置npm全局模块路径和cache默认安装位置

验证安装结果命令语句

运行nodejs项目


 今天给大家分享nodejs的环境搭建,以及我们如何才能搭建好一个nodejs项目运行到我们服务器上。

nodejs介绍

  • Node.js是一个基于Chrome V8引擎的[JavaScript运行环境]。 Node.js使用了一个事件驱动、非阻塞式I/O 的模型。

  • Node.js是一个让JavaScript运行在服务端的开发平台,它让JavaScript成为与PHP、Python、Perl、Ruby等服务端语言平起平坐的脚本语言。nodejs让javascript不再局限于放在html的嵌入式脚本,同时可以作为服务端开发的语言。
  • javascript和java除了在名称上优点类型,没有半毛钱关系
  • nodejs是JavaScript运行时环境,JEE是java的运行时环境。

npm是什么

官方网址:https://nodejs.org/dist/v16.17.1/

简单的说,npm就是nodejs的包管理工具(npm作用很类似与maven的作用
通俗的讲述npm的作用:
为啥我们需要一个包管理工具呢?因为我们在Node.js上开发时,会用到很多别人写的JavaScript代码。如果我们需要使用别人写的某个包,每次都根据名称搜索一下官方网站,下载代码,解压,再使用,非常繁琐。 于是一个集中管理的工具应运而生:大家都把自己开发的模块打包后放到npm官网上,如果要使用,直接通过npm安装就可以直接用,不用管代码存在哪,应该从哪下载。
更重要的是,如果我们要使用模块A,而模块A又依赖于模块B,模块B又依赖于模块X和模块Y,npm可以根据依赖关系,把所有依赖的包都下载下来并管理起来。否则,靠我们自己手动管理,肯定既麻烦又容易出错。

 配置环境变量 

点击下载node-v10.16.3-win-x64.zip,解压到系统盘符即可使用,配图

 

并在解压后的目录下建立node_global和node_cache这两个目录

目录说明
node_globalnpm全局安装位置
node_cachenpm缓存路径

 

编辑环境变量值 

环境变量配置示例
新增NODE_HOMEC:\Program Files\node-v10.16.3-win-x64(本机指定目录)
修改PATH在最后添加:;%NODE_HOME%;%NODE_HOME%\node_global;

  

修改Path变量值, %NODE_HOME%;%NODE_HOME%\node_global;

 

测试安装是否成功:打开cmd窗口,输出如下命令会输出NodeJs和npm的版本号

  • node -v
  • npm -v

 修改npm镜像提高下载速度

 #设置淘宝源 npm config set registry https://registry.npm.taobao.org/

测试是否镜像配置成功

#查看源,可以看到设置过的所有的源 npm config get registry

配置成功后会显示 已配置好的淘宝镜像

配置npm全局模块路径和cache默认安装位置

打开cmd,分开执行如下命令:

npm config set cache "C:\Program Files\node-v10.16.3-win-x64\node_cache"
npm config set prefix "C:\Program Files\node-v10.16.3-win-x64\node_global"
  • 1:将步骤一创建的node_global(npm全局安装位置)和node_cache(npm缓存路径)与npm联系起来
  • 2:如果执行命令卡死,可以删除C:\Users\用户名.npmrc 后重新执行。(用户名:为当前电脑的用户名)
  • 3:"D:\tools\node-v10.15.3-win-x64\node_global",双引号不能少
  • 4:node_global全局安装位置类似于Maven中的本地Jar包仓库

验证安装结果命令语句

1)版本验证

  • node -v
  • npm -v

2)查看镜像设置情况

  • npm get registry

3)查看npm全局路径设置情况
此步骤随便全局安装一个模块就可以测评

  • npm install webpack -g

4)以上命令执行完毕后,会生成如下文件,检查文件是否生成

  • %node_home%\node_global\node_modules\webpack

运行nodejs项目

我们已一个vueproject项目来演示如何安装和运行基于nodejs的项目。

  • 1)将项目考到D:\temp\vueproject进行解压(解压到当前目录即可),解压完成后将在D:\temp目录下看到vueproject目录
  • 2)进入cmd命令行,进入D:\temp\vueproject目录
  • 3)运行 npm install 命令

install命令做来什么
进行依赖安装,命令执行完后,你会发现,项目的根目录下多了一个node_modules文件夹,那里面就是从npm远程库里下载的模块,然后“安装”到你的项目中,此步骤,可理解成修改maven的pom文件添加依赖,然后maven再从中央仓库下载依赖。项目中的package.json就相当于maven的pom.xml文件的作用。
注:依赖的包比较大,node_modules目录大约167M,需要有比较好的网络。

安装完后如图

  • 4)启动项目npm run dev

启动后进入项目首页

 

  • 5)关闭项目,命令Ctrl + C  “Y”

这个项目就启动了,如果不用项目了,然后关闭项目

 

 

相关文章:

  • 【Android】之屏幕适配
  • 【JavaScript】五个常用功能/案例:计时器 | 流程控制 | 闭包应用 | arguments剩余参数 | 二次封装函数
  • Java Applet
  • 回归分析与模型诊断——作业
  • [ vulhub漏洞复现篇 ] ECShop 2.x / 3.x SQL注入/远程执行代码漏洞 xianzhi-2017-02-82239600
  • CF1443C题解
  • Tomcat相关概念
  • 网上商城之订单
  • 数学建模----拟合的实现
  • v-bind用法详解
  • Java实现随机人名抽取
  • 泰克TDS3012C数字荧光示波器TDS3012C
  • LSTM介绍理解
  • 深度学习——day27 class1 week3 神经网络概览及表示
  • 六级高频词汇——Group06
  • [译]CSS 居中(Center)方法大合集
  • 《微软的软件测试之道》成书始末、出版宣告、补充致谢名单及相关信息
  • Angular 响应式表单之下拉框
  • If…else
  • Java 最常见的 200+ 面试题:面试必备
  • JS进阶 - JS 、JS-Web-API与DOM、BOM
  • Laravel深入学习6 - 应用体系结构:解耦事件处理器
  • Node项目之评分系统(二)- 数据库设计
  • python_bomb----数据类型总结
  • React 快速上手 - 07 前端路由 react-router
  • Redis 中的布隆过滤器
  • vue-router的history模式发布配置
  • 初识MongoDB分片
  • 后端_ThinkPHP5
  • 基于阿里云移动推送的移动应用推送模式最佳实践
  • 使用阿里云发布分布式网站,开发时候应该注意什么?
  • 首页查询功能的一次实现过程
  • ​力扣解法汇总946-验证栈序列
  • ###C语言程序设计-----C语言学习(6)#
  • $.ajax()
  • $.ajax()参数及用法
  • (C语言)fread与fwrite详解
  • (Redis使用系列) Springboot 使用redis实现接口幂等性拦截 十一
  • (读书笔记)Javascript高级程序设计---ECMAScript基础
  • (二)springcloud实战之config配置中心
  • (简单有案例)前端实现主题切换、动态换肤的两种简单方式
  • (十二)devops持续集成开发——jenkins的全局工具配置之sonar qube环境安装及配置
  • (一)appium-desktop定位元素原理
  • (原創) 如何將struct塞進vector? (C/C++) (STL)
  • (转)自己动手搭建Nginx+memcache+xdebug+php运行环境绿色版 For windows版
  • .gitignore文件设置了忽略但不生效
  • .net core使用ef 6
  • .NET Standard 的管理策略
  • /usr/lib/mysql/plugin权限_给数据库增加密码策略遇到的权限问题
  • @开发者,一文搞懂什么是 C# 计时器!
  • [.net 面向对象程序设计进阶] (19) 异步(Asynchronous) 使用异步创建快速响应和可伸缩性的应用程序...
  • [100天算法】-实现 strStr()(day 52)
  • [Android Pro] listView和GridView的item设置的高度和宽度不起作用
  • [Android] 240204批量生成联系人,短信,通话记录的APK
  • [Angular] 笔记 20:NgContent