3.1 开发环境搭建
本章介绍的HTML5示例使用的是React及Node技术，以及VSCode（Visual Studio Code）这款开发工具。下面分别介绍开发环境的搭建。
3.1.1 Node安装
HTML5示例项目中需要使用Node.js（以下简称Node环境），所以首先要安装Node。简单地说，Node就是运行在服务器端的JavaScript，它是一个基于Chrome V8引擎的JavaScript运行环境。Node使用了一个事件驱动、非阻塞式I/O的模型，轻量又高效。Node的包管理器npm（node package manager）是全球最大的开源库生态系统，当我们安装好Node后会自带npm。
打开官网下载链接https://nodejs.org/en/download/，根据计算机的操作系统下载对应的Binary文件，如图3-1所示，然后根据提示一步步安装即可。
当安装完Node后，打开控制台。输入node-v命令可查看Node版本以及确定Node是否安装成功，输出内容如下所示。
xuanweizideMacBook-Pro:~ ksj$ node -v v13.2.0
图3-1 Node安装包
确定Node安装成功后，再输入npm-v命令可查看npm版本，输出内容如下所示。
xuanweizideMacBook-Pro:~ ksj$ npm -v 6.13.1
如果你安装的npm是旧版本，可以很容易通过npm命令来升级，命令如下。
npm install npm -g
这里的-g参数一定要添加，表示全局，这样你就可以在你的计算机中任意目录里使用npm命令。
基于网络原因，建议你使用淘宝镜像的命令，如下所示。这样做的目的是使得你安装依赖包时更快，防止网络问题导致程序运行不起来。
npm install -g cnpm --registry=https://registry.npm.taobao.org
执行上述命令后，就可以使用类似cnpm install的命令来替代npm install命令了。
3.1.2 VSCode安装
VSCode是一个轻量且强大的跨平台开源代码编辑器，支持Windows、MacOS和Linux。内置JavaScript、TypeScript和Node.js支持插件，而且拥有丰富的插件生态系统，可通过安装插件来支持C++、C#、Python、PHP等语言。这里我们使用此工具来开发React及Node.js程序。
打开VSCode官网https://code.visualstudio.com/下载VSCode，可以选择不同的系统，如图3-2所示。下载之后，直接按提示安装即可，不需要额外操作。
图3-2 下载VSCode
这里我们主要是用VSCode来写React及Node程序。这两种技术均采用JavaScript，所以安装相关插件即可。以代码检查工具ESLint为例，点击应用扩展图标，如图3-3所示。在搜索框内输入关键字ESLint，搜索结果列表中会显示和ESLint关键字相关的插件，点击第一个插件后，在右侧面板中点击Install按钮安装即可。
图3-3 VSCode插件安装
VSCode开发工具非常强大，可以根据技术或语言的需要安装不同类型的插件，例如，如果想开发Golang应用，添加Golang插件即可。