如你所知，npm作爲一個包管理工具，能做到開箱即用，模塊化可以說是其思想支撐。
最近做了一個地圖相關的項目，地圖上四種元素，每種元素裏面都有一個數據可視化模塊(圖表)。
最開始寫這個項目的時候，地圖上只有一種元素：燈。在燈的圖表上面加了一堆的東西，比如：chart，拖拽，消息處理，打印等等。後來發現修改過於複雜，於是進行模塊化整理，無疑對代碼可讀性有較大的提升。
之後燈連成組，再加上電錶以及三相開關，由於工期緊，所以直接copy一份代碼，但後來對圖表這塊稍微做一點改動，要涉及至少四個模塊，改起來很費勁不說，還容易遺忘。
痛定思痛，決定在這個基礎上再次進行代碼抽離，將公用組件以及函數全部抽離放進一個公用模塊，使用時直接調用。
雖說在抽離的時候很痛苦，但整合完畢，對於代碼複用性以及觀賞性也有了極大提升。此外，對於其他人調用相關模塊也不用太過關注其內部實現原理，加快了業務代碼開發速度。
演變過程如下圖：
之前：
整合之後：
是不是更加的清晰明瞭呢
寫在最後
對於模塊劃分的粒度要有一定的掌控，如果劃分太細緻，會導致整個代碼很鬆散，關聯性不強，最重要的是，當數據在很多個模塊之間傳遞時，因爲不可控因素增多，可能會導致數據丟失或出錯。