資訊專欄INFORMATION COLUMN
摘要：項目地址基于和的前端腳手架。目錄前言特性環境開始工程結構開發調試單元測試靜態部署相關文檔致謝前言如果你是一個初學者，這個項目可以是很好的教程。單元測試新增一個單元測試，你只需在中創建文件。在腳手架中用于擴展服務和代理。
項目地址: https://github.com/YutHelloWo...
基于React、Redux、React-Router@3.x、webpack和reactstrap的前端腳手架。
目錄前言
特性
環境
開始
工程結構
開發調試
單元測試
靜態部署
相關文檔
致謝
前言如果你是一個Reat初學者，這個項目可以是很好的教程。如果你在計劃使用React技術棧創建一個大型SPA，那么這個項目正好適合你。如果這個項目對你有幫助，請不吝嗇的給于star或者watch支持。
特性ES2015
Webpack
Redux
React-router
reactstrap
Eslint
Express
Babel
Karma
數據流 環境node ^5.0.0
yarn ^0.23.0 or npm ^3.0.0
開始在確認你的開發環境是以上環境配置，就開始可以基于這個腳手架創建你的應用了:
首先，克隆這個工程。
$ git clone https://github.com/yuthelloworld/vortex-react.git$ cd
然后，安裝工程依賴。推薦使用cnpm或Yarn，這樣可以節約你安裝依賴的所需的時間，避免出現一些莫名奇妙的錯誤。
$ yarn # Install project dependencies (or `npm install` or `cnpm install`)
最后，使用命令yarn start或者npm start來啟動該應用。
$ yarn start # Start the development server (or `npm start`)
這里還有一些其他的處理命令:
yarn
. ├── build ? ? ? ? ? ? ? ? ? # 打包配置 ├── public ? ? ? ? ? ? ? ? ? # 公共靜態資源 ├── server ? ? ? ? ? ? ? ? ? # express服務 │ ? └── main.js ? ? ? ? ? ? # 服務入口js ├── src ? ? ? ? ? ? ? ? ? ? # 應用源文件 │ ? ├── index.html ? ? ? ? ? # html模板 │ ? ├── main.js ? ? ? ? ? ? # 程序啟動和渲染 │ ? ├── normalize.js ? ? ? ? # 瀏覽器的兼容和墊片 │ ? ├── components ? ? ? ? ? # 全局可復用組件 │ ? ├── layouts ? ? ? ? ? ? # 主頁布局 │ ? │ ? └── PageLayout ? ? ? # 導航 │ ? ├── routes ? ? ? ? ? ? ? # 動態路由 │ ? │ ? ├── index.js ? ? ? ? # 主路由 │ ? │ ? ├── Home ? ? ? ? ? ? # 子路由Home │ ? │ ? │ ? ├── index.js ? ? # 路由定義和異步加載 │ ? │ ? │ ? ├── assets ? ? ? # 組件的靜態文件 │ ? │ ? │ ? ├── components ? # 展示組件 │ ? │ ? │ ? └── routes ** ? # 子路由 │ ? │ ? └── Counter ? ? ? ? # 子路由Couner │ ? │ ? ? ? ├── index.js ? ? # 路由定義 │ ? │ ? ? ? ├── container ? # 容器組件 │ ? │ ? ? ? ├── modules ? ? # module(reducers/constants/actions) │ ? │ ? ? ? └── routes ** ? # 子路由 │ ? ├── store ? ? ? ? ? ? ? # Redux相關模塊 │ ? │ ? ├── createStore.js ? # 創建和使用redux store │ ? │ ? └── reducers.js ? ? # Reducer的注冊和注入 │ ? └── styles ? ? ? ? ? ? ? # 樣式表 └── tests ? ? ? ? ? ? ? ? ? # 單元測試開發調試 在開發環境，采用了web-dev-middleware和web-hot-middleware。代碼實時熱更新。 Redux DevTools強烈推薦安裝谷歌瀏覽器插件Redux DevTools Chrome Extension,來查看整個應用的狀態時光穿梭。 我們使用React-router的plainRoute來定義應用的邏輯單元。 單元測試新增一個單元測試，你只需在./tests中創建.spec.js文件。 靜態部署如果你通過nginx web 服務來啟動應用，請確保路由指向~/dist/index.html，然后讓react-router處理剩下的事，更多參考這個文檔。Express在腳手架中用于擴展服務和代理API。 相關文檔知識地圖 致謝歡迎給這個項目提PR或者issues 文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。 轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/84532.html 相關文章
發表評論0條評論
wangbjun男|高級講師TA的文章閱讀更多
最新活動
閱讀需要支付1元查看
|
|---|
