開發環境 · FA+Ecloud互聯網應用開發平臺綜合技術入門指南(READ)

## 一、從零開始配置前端開發環境 1、下載VSCode及安裝； ![](https://img.kancloud.cn/8f/46/8f462fdfeb40605936a93c83157884e5_1334x648.png) ![](https://img.kancloud.cn/e4/f1/e4f1d472f6d9b5914df3b1857b78171f_612x471.png) ![](https://img.kancloud.cn/35/0f/350f49873219c614ced931a0078030a6_612x471.png) 安裝vetur和prettier插件；參考：[開發工具/前端調試/VSCode/安裝](../../%E5%BC%80%E5%8F%91%E5%B7%A5%E5%85%B7/%E5%89%8D%E7%AB%AF%E8%B0%83%E8%AF%95/VSCode/%E5%AE%89%E8%A3%85.md) 2、安裝nodejs、vue-cli、webpack及ESLint； [nodejs安裝](../../%E5%89%8D%E7%AB%AF%E6%8A%80%E6%9C%AF/Node.js/%E5%AE%89%E8%A3%85.md) [vueCli安裝](../../%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/vueCli/%E5%AE%89%E8%A3%85.md) [webpack安裝](../../%E5%89%8D%E7%AB%AF%E6%8A%80%E6%9C%AF/%E6%9E%84%E5%BB%BA%E5%B7%A5%E5%85%B7/webpack/%E5%AE%89%E8%A3%85.md) [ESLint安裝](../../%E5%89%8D%E7%AB%AF%E6%8A%80%E6%9C%AF/%E5%BC%80%E5%8F%91%E6%B5%8B%E8%AF%95/ESLint.md) 3、安裝git； [git安裝](../%E5%BC%80%E5%8F%91%E5%B7%A5%E5%85%B7/git.md) 4、導入git工程新建一個空的工程目錄，放到vscode的工作區根目錄下：然后參考： [快速開始一個工程](../../%E5%BC%80%E5%8F%91%E5%B7%A5%E5%85%B7/%E5%89%8D%E7%AB%AF%E8%B0%83%E8%AF%95/VSCode/%E5%BF%AB%E9%80%9F%E5%BC%80%E5%A7%8B.md) 5、與github工程關聯；工程建好后，內容是空的，打開工程后，打開終端，拉取工程代碼； ``` 如：git clone https://github.com/4170804/rayfront ``` ![](https://img.kancloud.cn/4e/17/4e177dc178e2b33cc5f8c862b00d0b13_1059x238.png) ![](https://img.kancloud.cn/c4/77/c477969a56ce47488a4fe3b204fa27d7_1024x392.png) 安裝依賴庫： ``` npm install ``` ![](https://img.kancloud.cn/64/04/6404164ef49bb0c07d5fa707b86cbac0_1045x424.png) 運行： ``` npm run serve ``` ![](https://img.kancloud.cn/1f/21/1f21996c33d27ffb7128423bdee119e6_1060x443.png) ![](https://img.kancloud.cn/17/08/1708039b81bd6f0631da45ff3dbc2ef1_1366x665.png) 即可啟動運行了，到這里，全部前端開發環境完整的走完了； ## 二、從零開始配置后端開發環境 1、下載eclipse及jdk開發包； ![](https://img.kancloud.cn/81/a9/81a9f7c31c02a8cb2ec71f45191ed624_1242x314.png) ![](https://img.kancloud.cn/e9/49/e949a7652e1d0c4faafaa7ddf056b2f3_893x510.png) 2、解壓文件包，配置好環境之后，下載工程文件，新建工程： ![](https://img.kancloud.cn/8b/72/8b72126615ec8ab68d66c4305c56803c_1366x736.png) ![](https://img.kancloud.cn/1b/b0/1bb0196a357bd7ed81d6f31cd97fbe1c_525x550.png) ![](https://img.kancloud.cn/9b/d2/9bd2fa82849508e93de85d7cc9171672_653x646.png) ![](https://img.kancloud.cn/6e/16/6e16c67981c33e39795ceec2359b1a51_683x480.png) ![](https://img.kancloud.cn/41/f2/41f20ecc9639457b1745f77ff309eaec_653x646.png) ![](https://img.kancloud.cn/37/3d/373dbc2c87e1c3a954188596cba12886_1366x736.png) 到這里，工程就完成了搭建了，接著，它會自動下載依賴庫到本地； ![](https://img.kancloud.cn/98/20/98201217a54abf7ab157a05cfc3c6cad_1366x736.png) 下載完畢，就可以開始干活了； ![](https://img.kancloud.cn/bf/07/bf07841b07c5117eab3d0ec5bc6d628a_1366x736.png) 3、配置開發環境；包括格式化等；參考：[項目實戰/后端開發/從零開始開發/開發環境搭建](../%E5%90%8E%E7%AB%AF%E5%BC%80%E5%8F%91/%E4%BB%8E%E9%9B%B6%E5%BC%80%E5%A7%8B%E5%BC%80%E5%8F%91/%E5%BC%80%E5%8F%91%E7%8E%AF%E5%A2%83%E6%90%AD%E5%BB%BA.md)