React前端開發環境搭建


先,我們需要明確的是React和很多前端框架一樣,底層都還是js以及html,即便它有着看似特殊的jsx語法。

我們要在服務端運行js,就需要依賴一個環境,和運行war包需要tomcat一類中間件一樣,運行js需要node.js,

同時因為我們用了各種框架,所以相應的module依賴也需要,需要使用npm工具,這就類似於maven管理jar包依賴一樣

同樣maven可以修改鏡像,而npm也可以改成淘寶的cnpm以及相應module庫地址。

 

let´s begin

(一)安裝Node.js、npm、cnpm

           當我們在官網下載並安裝Node時,npm也自動安裝好了,一路next后即可。安裝好后鍵入node -v 以及npm -v 來測試是否安裝成功(不需要自己手動配置系統環境變量)

           

          因為國內使用npm很慢,我們可以使用淘寶的cnpm,同時設置鏡像地址

          npm install -g cnpm --registry=https://registry.npm.taobao.org

安裝成功后,可以鍵入cnpm -v檢查是否安裝成功

(二)創建我們的第一個react程序

例如我們要在D:\workSpace下創建first-react-demo這個工程,並跑通,我們依次執行如下步驟

 

window下進入D:\workSpace這個文件夾,在地址欄鍵入cmd enter,

 

cnpm install -g create-react-app   全局安裝創建react-app的module(這一步不一定要在workspace目錄下)

 create-react-app first-react-demo  在workspct這個文件夾下創建fist-react-demo這個項目

但是,有可能會報錯 Unexpected end of JSON input while parsing near '....0","dependencies":{"' ,假如報錯,需要執行npm cache clean --force

在創建成功的基礎上,我們在打開first-react-demo這個文件夾,地址欄鍵入cmd並enter,在打開的cmd窗口中,鍵入npm start

大功告成。瀏覽器鍵入localhost:3000即可訪問

 

 

 

           

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM