Node.js及VSCode下载与安装

Posted 2021-07-15 寻7

Node.js及VSCode下载与安装

• 1，Node.js下载安装及配置
• • 1）node.js安装包下载路径（安装包有两种 在此以绿色版为例）
  • 2）下载完成得到压缩包
  • 3）安装（绿色版 解压即可）
  • 4）环境变量配置，新建NODE_HOME环境变量（变量值为node解压包路径）
  • 5）验证配置是否成功（Win+R快捷键 在输入框输入cmd 打开dos窗口）
• 2，VSCode下载安装
• • 1）下载路径
  • 2）下载/解压后安装包
  • 3）安装
  • 4）安装完成
  • 页面预览
  • 前端服务器-实现浏览器访问
• 3，node.js与npm关系
• • 1）node.js是什么？
  • 2）npm是什么？

1，Node.js下载安装及配置

官网下载（但是存在版本问题 下载后的软件在检验版本时发现提示操作系统需要Win8）
从官网下载安装包：https://nodejs.org/en/download/

1）node.js安装包下载路径（安装包有两种 在此以绿色版为例）

2）下载完成得到压缩包

3）安装（绿色版 解压即可）

找个安装位置进行解压即可

4）环境变量配置，新建NODE_HOME环境变量（变量值为node解压包路径）

在Path变量值引用NODE_HOME

5）验证配置是否成功（Win+R快捷键 在输入框输入cmd 打开dos窗口）

2，VSCode下载安装

官网下载安装包https://code.visualstudio.com/Download

1）下载路径

2）下载/解压后安装包

3）安装

自行选择安装路径

VSCode的默认安装路径为C:\\users\\用户名\\AppData\\Local\\Programs\\Microsoft VS Code可以对其进行修改
一些较为有用的配置说明：（使用默认配置也可以）

4）安装完成

页面预览

• 实现前端程序在编辑器中预览。左边开发,右边自动更新效果。
  • 打开应用扩展
    
  • 搜索 preview on web server 插件
  • 点击 install 安装
    
  • 使用方式，编辑文件处点击右键，选择以下两种打开方式之一，进行查看
    

前端服务器-实现浏览器访问

• 实现前端程序的浏览器访问。
  • 打开应用扩展
  • 搜索 live server 插件
  • 点击 install 安装
    
  • 使用方式，编辑文件处点击右键，选择 Open with Live Server ，进行查看
    

3，node.js与npm关系

1）node.js是什么？

node.js是javascript的运行环境，它不是一个js文件，实质是对Chrome V8引擎的封装。

node.js是一个开发平台，使得JavaScript能够运行于服务端，并使其成为地位与服务端语言（例如：python、php等）一样高的脚本语言。

node.js与chrome浏览器在解析JavaScript时都使用了V8引擎。

node.js的能力：
（1）提供了替代的API，使得V8引擎在非浏览器的环境下运行地更好；V8引擎执行JavaScript的速度非常快，性能非常好。
（2）其是一个基于chrome JavaScript运行时建立的平台，能方便地搭建响应速度快、易于扩展的网络应用。

2）npm是什么？

现实问题：当一个网站依赖的JS代码越来越多的时候，程序员发现很麻烦：jquery、bootstrap、underscore等都需要去不同的地方单独下载，并导入工程。所以有人想“为什么没有工具能统一管理这些资源呢？”

于是npm就出来了；其全称是node package manager（包管理工具）； npm这点和maven、gradle十分相似。但是maven与gradle是用来管理Java jar包的，而npm是用来管理js的。

其实现原理与maven和gradle一样：
（1）先建立一个远程代码仓库，用来存放所有的被共享的JS代码，并且每个JS文件都有自己唯一的标识符。
（2）用户想要使用某个JS文件时候，只需引用对应的标识符，就会自动下载下来。

但一开始出来的时候，并没有人鸟它。后来node.js也开发完成了，正缺少一个包管理工具，于是二者一拍即合，结果是node.js内置了npm（这也导致要下载npm的话，必须得下载node.js，其包含了npm）。后来随着node.js火了之后，很多人开始使用npm下载和共享代码。现在用npm分享代码已经成了前端的标配。