使用react腳手架初始化乙個專案

2022-08-23 10:39:14 字數 1053 閱讀 5050

一、安裝

檢測node.js是否安裝成功,最直接有效的辦法就是在命令提示符中輸入 

node -v
如下圖 如果出現node的版本號則表示安裝成功,可以看到我的node版本是10.15.3。

npm install -g cnpm --registry=https://
是全域性命令來建立react專案的 例如你的專案名叫 react-demo

等待它自動建立完成。

react腳手架專案目錄結構:

專案目錄下面的public和src目錄下的index檔案必須存在不能改名,其他的檔案可以刪除和改名,你可能在src目錄下面建立子目錄,react為了達到最快速的**重建,只有在src根目錄下的檔案會被webpack編譯,所以必須把檔案放在src根目錄下面,否則webpack不會識別。

三、npm命令

1.npm start

在http://localhost:3000

下監視檔案,檔案修改將自動更新,你可以在控制台中看到檢測錯誤。

2.npm test

在互動監視模式下啟動測試執行程式。

3.npm run build

在生產環境中編譯**,並放在build目錄中能夠正確的打包**,並且優化,壓縮,使用hash重新命名檔案。

4.npm run eject

React腳手架專案初始化基本流程

工具會自動初始化乙個腳手架並安裝 react 專案的各種必要依賴,如果在過程 現網路問題,請嘗試配置 或使用其他 npm registry。然後我們進入專案並啟動。cd antd demo yarn start此時瀏覽器會訪問 http localhost 3000 看到 welcome to re...

Vue腳手架初始化專案

在使用webpack之前,需確保安裝好環境,因為我的專案使用npm進行初始化,所以需要先配置node.js的環境,也可以使用yarn進行專案初始化 node v如果安裝成功,會顯示版本號 安裝完node後,我們開始正式初始化我們的vue專案 vue中文官網 開啟官網,使用npm進行安裝 使用npm前...

推薦乙個react腳手架工具

今天介紹乙個react腳手架,react cli,可以說是vue cli的外表,react的心!安裝步驟 npm install g sao sao yang302 react cli new project install cd new project npm install npm run de...