React多頁(yè)面應(yīng)用腳手架-v1.3.0

ACb0y 發(fā)布于2019-08-23 13:58 / 1009人閱讀

摘要：是一個(gè)基于和的多頁(yè)面應(yīng)用架構(gòu)，通過(guò)編譯生成對(duì)應(yīng)目錄結(jié)構(gòu)清晰的靜態(tài)頁(yè)面實(shí)現(xiàn)多頁(yè)面便捷開(kāi)發(fā)維護(hù)。對(duì)整體文件命名以及結(jié)構(gòu)做了大幅度調(diào)整頁(yè)面頁(yè)為一個(gè)簡(jiǎn)單預(yù)覽頁(yè)頁(yè)是一個(gè)基于的頁(yè)面整頁(yè)排版使用完整代碼參考項(xiàng)目

react-multi-page-app是一個(gè)基于react和webpack的多頁(yè)面應(yīng)用架構(gòu)，通過(guò)編譯生成對(duì)應(yīng)目錄結(jié)構(gòu)清晰的靜態(tài)頁(yè)面,實(shí)現(xiàn)多頁(yè)面便捷開(kāi)發(fā)維護(hù)。1.3.0 版本對(duì)項(xiàng)目整體做了一個(gè)全面的升級(jí)，添加修改的以下幾個(gè)方面：

增加項(xiàng)目創(chuàng)建命令rppx-cli

創(chuàng)建Demo展示頁(yè)面

完善修改REAMDME（中文/英文）

增加了redux的使用

優(yōu)化目錄結(jié)構(gòu)

優(yōu)化整體代碼

安裝及使用

全局安裝rppx-cli命令并創(chuàng)建自己的react多頁(yè)項(xiàng)目

安裝rppx-cli

$ npm install rppx-cli -g

創(chuàng)建react多頁(yè)項(xiàng)目

$ rppx init my-react

安裝依賴(lài)

$ npm install

開(kāi)發(fā)環(huán)境

$ npm run dev

編譯打包

$ npm run build

運(yùn)行

$ npm start

自動(dòng)打開(kāi)瀏覽器瀏覽頁(yè)面開(kāi)發(fā) http://localhost:3100 生產(chǎn) http://localhost:3118

創(chuàng)建新頁(yè)面

在src下創(chuàng)建一個(gè)文件目錄

在新創(chuàng)建的文件目錄下添加index.js（必須，因?yàn)槭莣ebpack打包入口文件）

在新創(chuàng)建文件夾下添加pageinfo.json（非必須）供html插件使用

npm run dev開(kāi)發(fā)

|-- src
    |-- index/
    |-- page2/
        |-- index.js
        |-- pageinfo.json

目錄結(jié)構(gòu)調(diào)整

v1.3.0 對(duì)整個(gè)文件結(jié)構(gòu)做了優(yōu)化

將將頁(yè)面文件放在src下的pages里統(tǒng)一管理

增加了store文件夾放redux相關(guān)文件。

對(duì)整體文件命名以及結(jié)構(gòu)做了大幅度調(diào)整

Demo頁(yè)面

http://www.h5cool.com/react-m...

home頁(yè)為一個(gè)簡(jiǎn)單預(yù)覽頁(yè)

todo頁(yè)是一個(gè)基于react-redux的todolist頁(yè)面

整頁(yè)排版使用bulma.css

完整代碼參考項(xiàng)目react-multi-page-app

云服務(wù)器 GPU云服務(wù)器多頁(yè)面應(yīng)用多頁(yè)面應(yīng)用管理頁(yè)面應(yīng)用詳情頁(yè)面

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/99877.html

相關(guān)文章

從 0 到 1 再到 100, 搭建、編寫(xiě)、構(gòu)建一個(gè)前端項(xiàng)目

摘要：從到再到搭建編寫(xiě)構(gòu)建一個(gè)前端項(xiàng)目選擇現(xiàn)成的項(xiàng)目模板還是自己搭建項(xiàng)目骨架搭建一個(gè)前端項(xiàng)目的方式有兩種選擇現(xiàn)成的項(xiàng)目模板自己搭建項(xiàng)目骨架。使用版本控制系統(tǒng)管理源代碼項(xiàng)目搭建好后，需要一個(gè)版本控制系統(tǒng)來(lái)管理源代碼。從 0 到 1 再到 100, 搭建、編寫(xiě)、構(gòu)建一個(gè)前端項(xiàng)目 1. 選擇現(xiàn)成的項(xiàng)目模板還是自己搭建項(xiàng)目骨架搭建一個(gè)前端項(xiàng)目的方式有兩種：選擇現(xiàn)成的項(xiàng)目模板、自己搭建項(xiàng)目骨架。 ...

call_me_R 2019-08-23 13:43 評(píng)論0 收藏0
從 0 到 1 再到 100, 搭建、編寫(xiě)、構(gòu)建一個(gè)前端項(xiàng)目

摘要：從到再到搭建編寫(xiě)構(gòu)建一個(gè)前端項(xiàng)目選擇現(xiàn)成的項(xiàng)目模板還是自己搭建項(xiàng)目骨架搭建一個(gè)前端項(xiàng)目的方式有兩種選擇現(xiàn)成的項(xiàng)目模板自己搭建項(xiàng)目骨架。使用版本控制系統(tǒng)管理源代碼項(xiàng)目搭建好后，需要一個(gè)版本控制系統(tǒng)來(lái)管理源代碼。從 0 到 1 再到 100, 搭建、編寫(xiě)、構(gòu)建一個(gè)前端項(xiàng)目 1. 選擇現(xiàn)成的項(xiàng)目模板還是自己搭建項(xiàng)目骨架搭建一個(gè)前端項(xiàng)目的方式有兩種：選擇現(xiàn)成的項(xiàng)目模板、自己搭建項(xiàng)目骨架。 ...

wzyplus 2019-08-02 12:08 評(píng)論0 收藏0
從 0 到 1 再到 100, 搭建、編寫(xiě)、構(gòu)建一個(gè)前端項(xiàng)目

摘要：從到再到搭建編寫(xiě)構(gòu)建一個(gè)前端項(xiàng)目選擇現(xiàn)成的項(xiàng)目模板還是自己搭建項(xiàng)目骨架搭建一個(gè)前端項(xiàng)目的方式有兩種選擇現(xiàn)成的項(xiàng)目模板自己搭建項(xiàng)目骨架。使用版本控制系統(tǒng)管理源代碼項(xiàng)目搭建好后，需要一個(gè)版本控制系統(tǒng)來(lái)管理源代碼。從 0 到 1 再到 100, 搭建、編寫(xiě)、構(gòu)建一個(gè)前端項(xiàng)目 1. 選擇現(xiàn)成的項(xiàng)目模板還是自己搭建項(xiàng)目骨架搭建一個(gè)前端項(xiàng)目的方式有兩種：選擇現(xiàn)成的項(xiàng)目模板、自己搭建項(xiàng)目骨架。 ...

aristark 2019-08-29 17:24 評(píng)論0 收藏0
本命年一定要記得穿紅褲衩：2015年總結(jié)

摘要：年終總結(jié)結(jié)果到這個(gè)時(shí)間才寫(xiě)，其實(shí)也是無(wú)奈。這一年最重要的事情就是順利從一只學(xué)生狗轉(zhuǎn)職為一只社畜。四月份畢業(yè)之后以前端工程師的職位入職天貓，到現(xiàn)在也差不多工作一年了。年終總結(jié)結(jié)果到這個(gè)時(shí)間才寫(xiě)，其實(shí)也是無(wú)奈。本來(lái)計(jì)劃過(guò)年寫(xiě)的，沒(méi)想到Steam竟然開(kāi)了個(gè)農(nóng)歷春節(jié)特惠，然后就被各種游戲打了，辣雞平臺(tái)，斂我錢(qián)財(cái)，頹我精神，耗我青春，害我單身以下全都是個(gè)人看法，如果有不認(rèn)同的地方，請(qǐng)大吼一聲...

AlienZHOU 2019-08-19 17:38 評(píng)論0 收藏0
本命年一定要記得穿紅褲衩：2015年總結(jié)

摘要：年終總結(jié)結(jié)果到這個(gè)時(shí)間才寫(xiě)，其實(shí)也是無(wú)奈。這一年最重要的事情就是順利從一只學(xué)生狗轉(zhuǎn)職為一只社畜。四月份畢業(yè)之后以前端工程師的職位入職天貓，到現(xiàn)在也差不多工作一年了。年終總結(jié)結(jié)果到這個(gè)時(shí)間才寫(xiě)，其實(shí)也是無(wú)奈。本來(lái)計(jì)劃過(guò)年寫(xiě)的，沒(méi)想到Steam竟然開(kāi)了個(gè)農(nóng)歷春節(jié)特惠，然后就被各種游戲打了，辣雞平臺(tái)，斂我錢(qián)財(cái)，頹我精神，耗我青春，害我單身以下全都是個(gè)人看法，如果有不認(rèn)同的地方，請(qǐng)大吼一聲...

xi4oh4o 2019-08-01 15:06 評(píng)論0 收藏0