前端模塊化結(jié)構(gòu)如何拆分

channg 發(fā)布于2019-08-23 14:21 / 1089人閱讀

摘要：模塊化結(jié)構(gòu)將復(fù)雜的程序拆分成不同的文件夾或者文件不同的模塊即獨立又可以相互關(guān)聯(lián)如何拆分具體的拆分規(guī)則針對不同的項目也不一樣，這里列出一點建議，更主要的還是有自己的一個規(guī)范，物以類聚將具有相同特性的可以拆分到一起，比如在一個電商網(wǎng)站項目中對文

模塊化結(jié)構(gòu)

將復(fù)雜的程序拆分成不同的文件夾或者文件
不同的模塊即獨立又可以相互關(guān)聯(lián)

如何拆分

具體的拆分規(guī)則針對不同的項目也不一樣，這里列出一點建議，更主要的還是有自己的一個規(guī)范，

物以類聚
將具有相同特性的可以拆分到一起，比如在一個vue電商網(wǎng)站項目中對文件夾的拆分

pages 源文件入口
    |-list 列表模塊(可能包括普通列表頁，閃購列表) 都可以認為是列表頁屬于一類
        |-list 普通列表頁
            |- components 組件
            |- router 路由
            |- store vuex
            |- index.js 打包js
        |-其它頁面

按功能拆分

 在上邊的結(jié)構(gòu)劃分中，普通列表頁有組件，路由，vuex,還有打包入口，這些都可以看成模塊，每個模塊各自負責不同的功能，
        components 負責存放普通列表頁多帶帶擁有的組件
        router 負責路由
        store 狀態(tài)
        index.js 等同于普通列表頁容器組件
 最終這些不同功能的模塊組合成了一個完整的頁面結(jié)構(gòu)

這里只說了兩種簡單的拆分思想給大家做個入門，真正項目拆分過程其實也是這樣，搞清楚自己的項目，
文件結(jié)構(gòu)如何拆分真正還是取決于自己，當然可以參考業(yè)界規(guī)范，一般情況下拆了就比不拆強，所以大家可以多嘗試

云服務(wù)器 GPU云服務(wù)器如何拆分數(shù)據(jù) js如何拆分單元格前端模塊化 phpcms模塊結(jié)構(gòu)

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

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/100480.html

相關(guān)文章

如何降低前端開發(fā)的復(fù)雜度

摘要：我們作為前端開發(fā)，都應(yīng)該具有這樣的能力。那么如何才能降低業(yè)務(wù)開發(fā)的復(fù)雜度呢細分組件都說模塊化開發(fā)，其實在，這些思想規(guī)范之前就已經(jīng)有模塊化開發(fā)的規(guī)范了，雖然標準從然后隔了年才有了，在那年基本都是函數(shù)式開發(fā)，一切皆函數(shù)。優(yōu)秀的程序員總是能優(yōu)雅的組織自己的代碼，清晰的編寫思路，合理的組織結(jié)構(gòu)劃分，從小的功能組件，到大的模塊結(jié)構(gòu)，都能通過合理的巧妙的搭配，不僅能化復(fù)雜為簡單，更能提升代碼運行...

wushuiyong 2019-08-29 15:15 評論0 收藏0
如何降低前端開發(fā)的復(fù)雜度

摘要：我們作為前端開發(fā)，都應(yīng)該具有這樣的能力。那么如何才能降低業(yè)務(wù)開發(fā)的復(fù)雜度呢細分組件都說模塊化開發(fā)，其實在，這些思想規(guī)范之前就已經(jīng)有模塊化開發(fā)的規(guī)范了，雖然標準從然后隔了年才有了，在那年基本都是函數(shù)式開發(fā)，一切皆函數(shù)。優(yōu)秀的程序員總是能優(yōu)雅的組織自己的代碼，清晰的編寫思路，合理的組織結(jié)構(gòu)劃分，從小的功能組件，到大的模塊結(jié)構(gòu)，都能通過合理的巧妙的搭配，不僅能化復(fù)雜為簡單，更能提升代碼運行...

xorpay 2019-08-26 11:52 評論0 收藏0
如何降低前端開發(fā)的復(fù)雜度

摘要：我們作為前端開發(fā)，都應(yīng)該具有這樣的能力。那么如何才能降低業(yè)務(wù)開發(fā)的復(fù)雜度呢細分組件都說模塊化開發(fā)，其實在，這些思想規(guī)范之前就已經(jīng)有模塊化開發(fā)的規(guī)范了，雖然標準從然后隔了年才有了，在那年基本都是函數(shù)式開發(fā)，一切皆函數(shù)。優(yōu)秀的程序員總是能優(yōu)雅的組織自己的代碼，清晰的編寫思路，合理的組織結(jié)構(gòu)劃分，從小的功能組件，到大的模塊結(jié)構(gòu)，都能通過合理的巧妙的搭配，不僅能化復(fù)雜為簡單，更能提升代碼運行...

LinkedME2016 2019-08-02 10:19 評論0 收藏0
基于SpringCloud的Microservices架構(gòu)實戰(zhàn)案例-架構(gòu)拆解

摘要：服務(wù)拆分具體拆分到多細，業(yè)內(nèi)沒有一個統(tǒng)一的標準。全部模塊基于，采用進行項目管理。比較常見的做法時，每個子服務(wù)模塊中獨立一個模塊，存放實體及對外的接口。自第一篇《基于SpringCloud的Microservices架構(gòu)實戰(zhàn)案例-序篇》發(fā)表出來后，差不多有半年時間了，一直也沒有接著拆分完，有如讀本書一樣，也是需要契機的，還是要把未完成的工作做完，雖然并不是什么經(jīng)典應(yīng)用，還是有必要將si...

gghyoo 2019-08-15 15:15 評論0 收藏0
權(quán)限設(shè)計的雜談

摘要：權(quán)限設(shè)計的雜談這篇文章的定位，不是宣傳某個框架，僅僅之是梳理一下有關(guān)權(quán)限方面的一些想法和最近項目中的一些探索過程。而這兩者的取舍則是有設(shè)計人員決定的。數(shù)據(jù)抽象原則最小特權(quán)劃分從某個程度上來說決定了控制的對象，而數(shù)據(jù)抽象原則是是決定了操作。權(quán)限設(shè)計的雜談這篇文章的定位，不是宣傳某個框架，僅僅之是梳理一下有關(guān)權(quán)限方面的一些想法和最近項目中的一些探索過程。我們主要想解決一下問題。什么...

yck 2019-08-19 10:53 評論0 收藏0