一、背景
有些組件不滿足業(yè)務(wù)時(shí)咱們只能修改插件的源碼：
- 直接在項(xiàng)目的node_modules下找到插件的源碼直接修改；
- 優(yōu)點(diǎn)：簡單直接、快速見效；
- 缺點(diǎn)：不能持久化，一旦重新npm install安裝就失效；不方便團(tuán)隊(duì)成員使用修改后的代碼；
- 去github上fork代碼到自己的倉庫進(jìn)行修改，并將自己修改過后的代碼發(fā)布到npm上使用；
- 優(yōu)點(diǎn)：團(tuán)隊(duì)成員都可以使用到這份修改的代碼；
- 缺點(diǎn)：麻煩、十分麻煩；
在網(wǎng)上找了很多解決方案最多的是patch-package?但是我們使用的組件包來源民間大神修改，改動(dòng)范圍廣，導(dǎo)致使用這個(gè)根本沒有用，還產(chǎn)生沖突。所以找到了覆蓋組件代碼的方法簡單粗暴。
二、替換插件包（拷貝覆蓋法）
npm install 完成后會(huì)執(zhí)行package.json 文件里的script內(nèi)的postinstall鉤子。在這個(gè)勾子執(zhí)行cp?修改過的文件?./node_modules/包名/原始文件拷貝過去，最終node_modules下的文件就變成了修改后的文件了，應(yīng)用在本篇element-ui例子中如下：
在自己的項(xiàng)目中存放修改插件包，如下圖：element-ui
最后在package.json文件里加入下圖的代碼：
其中要加-r 不然只能拷貝文件不能拷貝文件夾 ；源文件最后要加*來移動(dòng)文件內(nèi)所有的文件夾以及文件；
"postinstall": "cp -r ./element-ui/* ./node_modules/element-ui"
?即在每次install包后執(zhí)行用修改后文件覆蓋原始文件邏輯。
三、引用自定義包 （引用法）文章來源：http://www.zghlxwxcb.cn/news/detail-487807.html
另外一種是直接將自定義模塊放在node_modules外面的另一個(gè)目錄中，并將其作為文件引用添加到package.json?使用時(shí)要把package-lock.json文件刪除再npm install 安裝依賴。文章來源地址http://www.zghlxwxcb.cn/news/detail-487807.html
"dependencies": {
"yu-element-ui": "file:yu-element-ui"
}到了這里，關(guān)于node_modules插件代碼修改，如何快速修改防止npm install安裝覆蓋代碼的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
