React Reactjs 环境搭建 新手入门 npm yarn

界面打算将silverlight 的前端界面更新成React 

1.下载:

https://nodejs.org/en/

React Reactjs 环境搭建 新手入门 npm yarn_第1张图片

2.下载了10.16.3 LTS (喜欢下载相对稳定的版本)

3.安装

4.检查是否安装成功了(默认步骤npm也一起装好的,安装cnpm在创建项目的时候可能会创建失败,所以只装了npm)

React Reactjs 环境搭建 新手入门 npm yarn_第2张图片

如果环境变量没有就新增这个环境变量到Path

React Reactjs 环境搭建 新手入门 npm yarn_第3张图片

React Reactjs 环境搭建 新手入门 npm yarn_第4张图片

AppData是C盘的隐藏文件夹可以直接输入查看目录里的文件,也可以设置显示隐藏目录,点击目录查看

React Reactjs 环境搭建 新手入门 npm yarn_第5张图片

5.安装create-react-app脚手架

6.创建一个项目(由于C盘空间不足,早晨将D盘空间移到C盘,避免了重装系统)

选中创建React项目的路径,输入cmd

React Reactjs 环境搭建 新手入门 npm yarn_第6张图片

7.在文件目录先打开了cmd命令窗口(也可以按住shift+右键 选择这个选项)

React Reactjs 环境搭建 新手入门 npm yarn_第7张图片

8.创建一个名为create_demo_1 的项目(项目名称不能有大写字母)

React Reactjs 环境搭建 新手入门 npm yarn_第8张图片

React Reactjs 环境搭建 新手入门 npm yarn_第9张图片

9.目录中创建了项目

10.安装yarn(在之前安装的npm目录下安装,有些人在安装脚手架的时候一起装了:npm install create-react-app yarn -g)

React Reactjs 环境搭建 新手入门 npm yarn_第10张图片

11.下载VS code(Visual Studio Code)

我下载的是中文版的(我的是win8系统,下载一个兼容的版本就好)

12.安装VS code,可以选择在桌面创建快捷方式

13.双击打开,然后选择File->Open Folder 选择

React Reactjs 环境搭建 新手入门 npm yarn_第11张图片

14.点击 View->Terminal

输入 yarn start

React Reactjs 环境搭建 新手入门 npm yarn_第12张图片

15.出现如下界面,一切就都安装好了。

React Reactjs 环境搭建 新手入门 npm yarn_第13张图片

你可能感兴趣的:(React Reactjs 环境搭建 新手入门 npm yarn)