入门学习
一定要先下载 nvm,再用 nvm 下载 node。
简介
Node.js 是一个基于 Chrome V8引擎的 JavaScript运行环境:即 Node.js 内置了 Chrome 的 V8引擎,可以在 Node.js环境中直接运行 JavaScript程序。
既是一个 JavaScript引擎,也可以说是一个 JavaScript环境,通过它可直接运行 JavaScript。所以我们不需要引入 vue、axios等的 js文件了。
浏览器的内核包括两部分核心:DOM渲染引擎、JavaScript解析引擎。
通常他会被用来作一个BFF层,即 Backend For Frontend(服务于前端的后端),通俗的说是一个专门用于为前端业务提供数据的后端程序。
-
JavaScript运行环境
-
模拟服务端效果
BFF
可以分别请求不同的服务接口,获取到数据,然后把数据封装整合后传到页面中显示
一个前端页面向 Service A、Service B 以及 Service C 发送请求,不同的微服务返回的值用于渲染页面中不同的组件。此时,每次访问该页面都需要发送 3个请求。所以我们需要一个服务来聚合 Service A、Service B 以及 Service C 响应的数据,这个服务层叫做 BFF。
BFF层的作用是让前端有能力自由组装后台数据,减少大量的业务沟通成本,加快业务的迭代速度。
NPM
简介
NPM 全称 Node Package Manager,是 Node.js 的包管理工具,功能很像后端的 Maven,是全球最大的模块生态系统,里面所有的模块都是开源免费的。
初始化配置
项目初始化(非必须)
#建立一个空文件夹,在命令提示符进入该文件夹 执行命令初始化 npm init #按照提示输入相关信息,如果是用默认值则 直接回车即可。 #name: 项目名称 #version: 项目版本号 #description: 项目描述 #keywords: {Array}关键词,便于用户搜索到我们的项目 #最后会生成package.json文件,这个是包的配置文件,相当于maven的pom.xml #我们之后也可以根据需要进行修改 #如果想直接生成 package.json 文件,那么可以使用命令 npm init -y
修改镜像(必须)
NPM官方的管理的包都是从 npm | Home 下载的,但是这个网站在国内速度很慢。
这里推荐使用淘宝 NPM 镜像 http://npm.taobao.org/ ,淘宝 NPM镜像是一个完整npmjs.com 镜像。
npm get registry 可以看到当前数据源 #经过下面的配置,以后所有的 npm install 都会经过淘宝的镜像地址下载 npm config set registry https://registry.npm.taobao.org #查看npm配置信息 npm config list
npm install命令的使用
#使用 npm install 安装依赖包的最新版。最常用 #模块安装的位置:项目目录\node_modules #同时package.json 文件中,依赖包会被添加到dependencies节点下,类似maven中的 <dependencies> #默认参数:--save 简写 -S 将当前依赖保存在dependencies节点下 npm install jquery #如果安装时想指定特定的版本 npm install jquery@2.1.x #devDependencies节点:开发时的依赖包,项目打包到生产环境的时候不包含的依赖 #使用 -D参数将依赖添加到devDependencies节点 npm install --save-dev eslint #或简写 npm i -D eslint #全局安装 #Node.js全局安装的npm包和工具的位置:用户目录\AppData\Roaming\npm\node_modules #一些命令行工具常使用全局安装的方式 npm install --global webpack #或简写 npm install -g webpack #npm管理的项目在备份和传输的时候一般不携带node_modules文件夹 #安装会自动在项目目录下添加 package-lock.json文件,这个文件帮助锁定安装包的版本 npm install #根据package.json中的配置下载依赖,初始化项目 #更新包(更新到最新版本) npm update 包名 #全局更新 npm update -g 包名 #卸载包 npm uninstall 包名 #全局卸载 npm uninstall -g 包名
npm install 常用下载
// 全局安装 webpack,win+r cmd npm install webpack -g // 全局安装 @vue/cli-init npm install -g @vue/cli-init // 安装 element-ui,i 就是 install 的缩写 npm install element-ui = npm i element-ui
nvm-node
nvm 是 Node 的多版本管理工具,zip安装可以按照 B站视频来,收藏在学习里面了。
傻瓜式安装:
在windows下切换多个版本node.js最优解决方案无需配置环境变量_windows node版本切换-CSDN博客
Releases · coreybutler/nvm-windows (github.com)
zip安装:
Windows/macOS/Linux上安装Node.js,并使用NVM管理多版本Node.js - 雨月空间站
常用命令
// 查看已安装的 Node nvm list // 通过 nvm 查看可以安装的 Node 的各种版本 # macOS/Linux nvm ls-remote --lts # Windows nvm list available // nvm 安装 Node node install 12.21 // nvm 使用 Node nvm use 12.21