使用VSCode編輯器搭建React的基礎使用環境(Visual Studio Code官方下載地址)
一、搭建React使用環境
1.檢查是否安裝React包
在任意位置開啟命令視窗

輸入命令:
npm list -g --depth=0
如果有下面這個包的話標明已經安裝好React了,可以直接跳過安裝進入建立環節,如果沒有可以可以按照以下步驟安裝

2.安裝React
在命令視窗輸入:
npm i create-react-app -g

注意由於伺服器是在國外,速度會較慢,而且容易丟包,建議使用科學上網或者使用阿里的提供伺服器下載,即以下程式碼
cnpm i create-react-app -g
出現一下程式碼即安裝成功

3.安裝VSCode上執行React的相關外掛
安裝好VSCode後,開啟軟體

在外掛中搜尋ES7

第一個ES7 React/Redux/GraphQL/React-Native snippets就是執行React的執行外掛,點選安裝,安裝好後重啟VSCode。
二、建立
1.建立react
在命令視窗輸入:
create-react-app first-react-project(專案名稱)

出現以下程式碼即建立成功

將命令視窗切換至專案資料夾,輸入執行命令
npm start
如果沒有報錯,React專案執行成功


