資訊專欄INFORMATION COLUMN
摘要：再談前端項目的組件化之前詳細聊過的前端項目的組件化，可以參考組件化與私有倉庫，今天來更進一步的說說前端項目的組件化。
再談前端項目的組件化
之前詳細聊過的前端項目的組件化，可以參考 組件化 與 私有 npm 倉庫，今天來更進一步的說說前端項目的組件化。
1. 之前的組件化目錄結構：
-project1 # 項目1 -project2 # 項目2 -component1 # 組件1 -component2 # 組件2
project1 的 package.json：
{
"dependencies": {
"@yourCompany/component1": "^0.0.1",
"@yourCompany/component2": "^0.0.1"
}
}
在代碼中使用：
import component1 from "@yourCompany/component1";2. 之前的組件化方式存在的問題
更新組件比較麻煩，特別是對于一些與業(yè)務耦合比較深的組件，頻繁更新會比較頭疼
組件太多的時候，管理起來就感覺比較累，因為每個組件都是一個多帶帶的項目，都有一套獨立的構建環(huán)境
對于有些代碼量小的組件，做一個多帶帶的項目，實在有點大才小用
3. 另外的項目組件化方式針對上面講到的問題，另一種方式可以很好的解決：
目錄結構：
-project1 # 項目1 -project2 # 項目2 -components # 組件集合項目
components 組件集合項目的目錄結構：
- src/ # 源代碼目錄 - component1 # 組件1 - component2 # 組件2 - component3 # 組件3 - ... - package.json - README.md - CHANGELOG.md - .eslintrc.js - .stylelintrc.js - .prettierrc.js - ...
把 components 目錄軟鏈接 project1 目錄下：
（注意： project1 的 .gitignore 需加上 /components）
# 以下是 linux 命令，windows 類似 cd project1 ln -s ../components ./
project1 項目的目錄結構：
- src/ # 源代碼目錄 - components/ # 組件項目目錄（軟鏈接） - package.json - README.md - CHANGELOG.md - .eslintrc.js - .stylelintrc.js - .prettierrc.js - ...
在代碼中使用：
import component1 from "relative/path/to/components/src/component1";4. 兩種方式的選擇
上面的兩種方式各有各的優(yōu)勢，可以配合一起使用。
大的、不常更新的組件可以使用 npm 包的方式，小的、常更新的可以使用軟鏈接項目的方式。
后續(xù)更多博客，查看 https://github.com/senntyou/blogs
作者：深予之 (@senntyou)
版權聲明：自由轉載-非商用-非衍生-保持署名（創(chuàng)意共享3.0許可證）
文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/104877.html
摘要：中的生命周期函數(shù)也可以稱之為生命周期鉤子函數(shù)，在特定的時期，調(diào)用特定的函數(shù)。吊起鉤子函數(shù)調(diào)起鉤子函數(shù)問題為什么是一個數(shù)組卸載組件，會觸發(fā)一個這行代碼之后發(fā)生了什么背后實現(xiàn)原理。 簡介 關于Vue的生命周期函數(shù)，目前網(wǎng)上有許多介紹文章，但也都只是分析了表象。這篇文檔，將結合Vue源碼分析，為什么會有這樣的表象。 Vue中的生命周期函數(shù)也可以稱之為生命周期鉤子（hook）函數(shù)，在特定的時期...
摘要：阿里云效平臺基于理念的私有平臺實踐本文將系統(tǒng)的從個方面，分享互娛運維團隊對于運維平臺實踐經(jīng)驗及未來展望，希望對大家有一些參考意義。 CI Weekly 圍繞『 軟件工程效率提升』 進行一系列技術內(nèi)容分享，包括國內(nèi)外持續(xù)集成、持續(xù)交付，持續(xù)部署、自動化測試、 DevOps 等實踐教程、工具與資源，以及一些工程師文化相關的程序員 Tips 。同步于 flow.ci Blog、微信公眾號、官...
閱讀 2078·2021-10-08 10:21
閱讀 2471·2021-09-29 09:34
閱讀 3494·2021-09-22 15:51
閱讀 4926·2021-09-22 15:46
閱讀 2313·2021-08-09 13:42
閱讀 3434·2019-08-30 15:52
閱讀 2722·2019-08-29 17:13
閱讀 1554·2019-08-29 11:30
