ruoyi-vue部署2

3.Node.js

3.1.什么是Node.js

在 Node.js 之前,JavaScript 只能运行在浏览器中,作为网页脚本使用,为网页添加一些特效,或者和服务器进行通信。有了 Node.js 以后,JavaScript 就可以脱离浏览器,像其它编程语言一样直接在计算机上使用,想干什么就干什么,再也不受浏览器的限制了。

Node.js 不是一门新的编程语言,也不是一个 JavaScript 框架,它是一套 JavaScript 运行环境,用来支持 JavaScript 代码的执行。用编程术语来讲,Node.js 是一个 JavaScript 运行时(Runtime)。

Node.js是一个基于Chrome V8引擎的[JavaScript运行环境]。Node.js使用了一个事件驱动、非阻塞式I/O 的模型。Node.js是一个让JavaScript运行在服务端的开发平台,它让JavaScript成为与PHP、Python、Perl、Ruby等服务端语言平起平坐的脚本语言。不能再将它视为一种"小玩意"。

1)Node.js依赖JavaScript运行环境,开发语言是:Javascript 2)J2EE依赖Java运行环境,开发语言是:Java

3.2.什么是Npm

npm(Node.js Package Manager)是一个Node.js的包管理工具,用来解决Node.js代码部署问题。在安装Node.js时会自动安装相应的npm版本,不需要单独安装。使用npm包管理工具可以解决如下场景的需求:

● 允许用户从NPM服务器下载他人编写的第三方包到本地使用。

● 允许用户从NPM服务器下载并安装他人编写的命令行程序到本地使用。

● 允许用户将自己编写的包或命令行程序上传到NPM服务器供他人使用。

npm==maven 有点类似

3.3.Node.js环境搭建

3.3.1.下载

下载地址:Node.js --- Download Node.js®

注1:Node有两个版本线: LTS是长期维护的稳定版本Current是新特性版本

3.3.2.解压

将下载的node-v10.15.3-win-x64.zip解压到指定目录中,并在解压后的目录下建立node_globalnode_cache这两个目录。

node_global :npm全局安装位置;node_cache:npm缓存路径

3.3.3.配置环境变量

新增NODE_HOME,值为:D:\tools\node-v10.15.3-win-x64(视自己安装目录而定),修改PATH并在最后添加:;%NODE_HOME%;%NODE_HOME%\node_global;

  • 配置NODE_HOME
  • 配置Path

环境变量查看: echo %node_home%,echo %path% 测试安装是否成功: node -v,npm -v

3.3.4.npm配置

配置npm全局安装位置和缓存路径。打开CMD,分别执行如下命令:

复制代码
npm config set cache "D:\tools\node-v14.15.0-win-x64\node_cache"
npm config set prefix "D:\tools\node-v14.15.0-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",双引号不能少

修改npm镜像提高下载速度

可以使用 cnpm或直接设置--registry,推荐设置--registry

  • --Registry
复制代码
## 设置淘宝源
npm config set registry https://registry.npm.taobao.org/
## 查看源,可以看到设置过的所有的源
npm config get registry

npm config set registry https://registry.npmmirror.com

  • cnpm
复制代码
npm install -g cnpm --registry=https://registry.npm.taobao.org

1)cnpm安装完成后,以后就可以用cnpm命令代替npm命令, 此时npm还是会用官方镜像,cnpm会用国内镜像; 2)如果要恢复成原来的设置,执行如下:npm config set registry https://registry.npmjs.org/

安装配置webpack

复制代码
npm install webpack -g

以上命令执行完毕后,会生成如下文件: %node_home%\node_global\node_modules\webpack

3.3.5.如何运行下载的Node.js项目

将下载的项目解压到指定目录,本例是解压到:D:\temp\vueproject,后面都以此为例

复制代码
## 1.打开命令窗口
cmd
## 2.切换到d盘
d:
## 3.进入指定目录
cd D:\temp\vueproject
## 4.进行依赖安装
npm install
## 5.启动项目
npm run dev
相关推荐
冬枳17 分钟前
为 VUE 脚手架添加开发常用的插件/配置
vue.js
MiyueFE18 分钟前
bpmn-js 源码篇8:Featrues 体验优化与功能扩展(三)
前端·javascript
野猪佩奇00727 分钟前
Vue项目的 Sass 全局基础样式格式化方案,包含常见元素的样式重置
前端·css·vue.js·sass
独立开阀者_FwtCoder28 分钟前
penAI重磅发布GPT-4o文生图:免费、精准、媲美真实照片!
前端·后端·面试
冬枳35 分钟前
搭建一个开箱即用的脚手架
vue.js
IBELIEVE36 分钟前
前端打包文件本地简易部署
前端
逆袭的小黄鸭38 分钟前
仿 ElementPlus 组件库(九)—— Switch 组件实现
前端·vue.js·typescript
小太阳82140 分钟前
🌟【开源推荐】基于Vue3 + Mango.js的轻量级后台模板Mango Admin发布,RBAC+国际化开箱即用!
vue.js·bun
curdcv_po40 分钟前
Vue 项目线上更新无需强制刷新的方案
前端
dchen771 小时前
xhr和fetch的一些区别对比
前端·javascript·面试