002-創建基本項目-新項目、空項目、已有項目
阿新 • • 發佈:2018-04-28
rmi copies .html ack 結構 eat bundles 依賴項 fig
一、創建基本項目
您可以使用create-react-app軟件包或創建一個空的IntelliJ IDEA項目並在其中安裝React。create-react-app項目地址:https://github.com/facebookincubator/create-react-app
1.1、使用create-react-app生成React應用程序【第一種】
create React App是開始構建新的React單頁應用程序的推薦方式。因此,您的開發環境已預先配置為使用webpack,Babel,ESLint和其他工具。詳細了解如何安裝React並從React官方網站創建React應用程序。
1》全局安裝create-react-app
打開內置終端(View | Tool Windows | Terminal)並在命令提示符下鍵入npm install -g create-react-app。
2》創建一個應用程序
1》
npm start Starts the development server. npm run build Bundles the app into static files for production. npm test Starts the test runner. npm run eject Removes this tool and copies build dependencies, configuration files and scripts into the app directory. If you do this, you can’t go back! We suggest that you begin by typing: cd test_react_app npm start Happy hacking! Done
目錄結構
註意:要下載項目依賴關系,請執行以下操作之一:
打開Terminal(View | Tool Windows | Terminal)並在命令提示符下鍵入npm install。
在項目根目錄中的package.json文件的上下文菜單中選擇運行‘npm install‘。
1.2、在空白的IntelliJ IDEA項目中安裝React
在這種情況下,您將不得不按照以下構建React應用程序中的描述來自行配置構建管道。詳細了解如何將React添加到React官方網站的項目中。
1》創建一個空的IntelliJ IDEA項目
1》
{
"name": "test2_react_app",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.3.2",
"react-dom": "^16.3.2",
"react-scripts": "1.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
3.3、從現有的React應用程序開始
要繼續開發現有的React應用程序,請在IntelliJ IDEA中打開它並下載所需的依賴項。
1》打開機器中已有的應用程序源
File→Open
或者也可以從版本庫中檢出項目
2》下載依賴
在package.json上運行,npm install
002-創建基本項目-新項目、空項目、已有項目