成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

一個經(jīng)過優(yōu)化的react腳手架,拿來就能開發(fā)

UnixAgain / 2889人閱讀

摘要:拿來即用的腳手架沒有使用,直接走顯性配置,使配置透明。腳手架是我根據(jù)大多數(shù)公司的業(yè)務,取其共同需求搭建的,并且做了項目優(yōu)化,不管小項目還是大項目都可以很好的支撐。建議項目公共樣式包括框架裝飾頁使用,頁面級樣式采用,以防止樣式污染。

react-ve

拿來即用的 react 腳手架

沒有使用create-react-app,直接走webpack顯性配置,使配置透明。

腳手架是我根據(jù)大多數(shù)公司的業(yè)務,取其共同需求搭建的,并且做了項目優(yōu)化,不管小項目還是大項目都可以很好的支撐。

一點建議

建議使用typescript開發(fā)

在數(shù)據(jù)控制方面,推薦你使用ImmutableJs來控制數(shù)據(jù),因為它和react真的是絕配

頁面經(jīng)常會存在用戶操作時出現(xiàn)的組件,比如通過點擊出現(xiàn)彈框,如果彈框內(nèi)容過大,推薦你使用async-loadable,它能很方便的獲取按需加載的組件。

在樣式方面,建議公用的樣式使用less直接引用在入口文件中,頁面級樣式使用styled-components

優(yōu)化

代碼丑化壓縮

代碼分割(code-splitting) 模板使用基于路由的動態(tài)導入

使用 DLL 將公用依賴庫模塊封裝為一個獨立文件

安裝及使用

npm install react-ve -g

react-ve init [projectName]

啟動項目

cd [projectName]

yarnnpm install

npm run dll

npm start

在瀏覽器地址欄中輸入:localhost:3000即可訪問

項目打包,運行npm run build即可,項目將打包至dist文件夾內(nèi)

默認使用技術(shù)棧:

react

typescript

antd

styled-components

react-router-dom

immutable

你可以根據(jù)喜好來installuninstall它們。

建議:

項目公共樣式(包括antd、框架、裝飾頁)使用less,頁面級樣式采
styled-components,以防止樣式污染。

DLL :

webpack.dll.config.babel.js中,默認打包的公共包包括:

entry: {
    vendor: ["react", "react-dom", "antd", "react-router-dom", "immutable"]
  }

你可以根據(jù)自己的喜好做刪減

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

轉(zhuǎn)載請注明本文地址:http://m.hztianpu.com/yun/96029.html

相關(guān)文章

  • 利用 Nowa 分分鐘創(chuàng)建和維護 React 應用,拋棄命令行

    摘要:接下來會介紹如何使用快速開發(fā)應用。但是因為是教程,所以我們點按鈕創(chuàng)建項目。從創(chuàng)建到啟動,不過一分鐘的事情,是不是超級方便快捷呢小特性用戶可以在右側(cè)命令集區(qū)添加自定義命令,所有的命令都一鍵運行,你都不需要打開終端了。 前言吐槽 前端的技術(shù)發(fā)展辣么快,對于前端新手來說,我還沒怎么使用 jQuery 開發(fā)界面就要換成Angular & Vue & React & ... 更復雜的是,用戶還要...

    coolpail 評論0 收藏0
  • 淺談MVC,MVP,MVVM漸進變化及React與Vue比較

    摘要:將注意力集中保持在核心庫,而將其他功能如路由和全局狀態(tài)管理交給相關(guān)的庫。此示例使用類似的語法,稱為。執(zhí)行更快,因為它在編譯為代碼后進行了優(yōu)化?;诘哪0迨沟脤⒁延械膽弥鸩竭w移到更為容易。 前言 因為沒有明確的界定,這里不討論正確與否,只表達個人對前端MV*架構(gòu)模式理解看法,再比較React和Vue兩種框架不同.寫完之后我知道這文章好水,特別是框架對比部分都是別人說爛的,而我也是打算把...

    DrizzleX 評論0 收藏0
  • 網(wǎng)易音樂版輪播-react組件版本

    摘要:說明此版本輪播圖為仿照網(wǎng)易云音樂播放器上首頁的輪播。網(wǎng)易的輪播特殊的地方就在于,如果你滑動不相鄰的兩張圖片,其過渡效果并不是滑動過渡,而是一個跳出過渡,此方面原理與最開始設計輪播排版時候有極大關(guān)聯(lián)。 說明: 此版本輪播圖為仿照網(wǎng)易云音樂PC播放器上首頁的輪播。 網(wǎng)易的輪播特殊的地方就在于,如果你滑動不相鄰的兩張圖片,其過渡效果并不是滑動過渡,而是一個跳出過渡,此方面原理與最開始設計輪播...

    趙春朋 評論0 收藏0
  • 網(wǎng)易音樂版輪播-react組件版本

    摘要:說明此版本輪播圖為仿照網(wǎng)易云音樂播放器上首頁的輪播。網(wǎng)易的輪播特殊的地方就在于,如果你滑動不相鄰的兩張圖片,其過渡效果并不是滑動過渡,而是一個跳出過渡,此方面原理與最開始設計輪播排版時候有極大關(guān)聯(lián)。 說明: 此版本輪播圖為仿照網(wǎng)易云音樂PC播放器上首頁的輪播。 網(wǎng)易的輪播特殊的地方就在于,如果你滑動不相鄰的兩張圖片,其過渡效果并不是滑動過渡,而是一個跳出過渡,此方面原理與最開始設計輪播...

    whidy 評論0 收藏0
  • 網(wǎng)易音樂版輪播-react組件版本

    摘要:說明此版本輪播圖為仿照網(wǎng)易云音樂播放器上首頁的輪播。網(wǎng)易的輪播特殊的地方就在于,如果你滑動不相鄰的兩張圖片,其過渡效果并不是滑動過渡,而是一個跳出過渡,此方面原理與最開始設計輪播排版時候有極大關(guān)聯(lián)。 說明: 此版本輪播圖為仿照網(wǎng)易云音樂PC播放器上首頁的輪播。 網(wǎng)易的輪播特殊的地方就在于,如果你滑動不相鄰的兩張圖片,其過渡效果并不是滑動過渡,而是一個跳出過渡,此方面原理與最開始設計輪播...

    Tikitoo 評論0 收藏0

發(fā)表評論

0條評論

UnixAgain

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<