npm install可以幫助我們安裝很多有用的依賴包
這些依賴包都在根目錄的?node_modules 文件中
一般情況下我們不會(huì)去修改?node_modules 依賴包中的源碼
但凡事總有例外
今天我就教大家如何優(yōu)雅、簡(jiǎn)單地修改依賴包中的源碼
把別人的代碼，變成自己的代碼
總結(jié)了兩種方法
方法一：
步驟一、通過(guò)命令安裝??patch-package
執(zhí)行：npm install patch-package --save-dev
步驟二、修改項(xiàng)目根目錄下的 package.json 文件
在 package.json 文件中的?scripts?中加入?"postinstall": "patch-package"
步驟三、手動(dòng)修改?node_modules 依賴包中的源碼
? ? 例如，我修改的是topology-vue這個(gè)依賴包中的源碼，文件在
? ? node_modules/topogu-vue/topology-vue.umd.js
? ? node_modules/topogu-vue/topology-vue.css
? ?【為什么修改topology-vue.umd.js文件中的代碼，項(xiàng)目才會(huì)生效呢？打開(kāi)node_modules/topogu-vue/package.json文件找到main,發(fā)現(xiàn)該模塊對(duì)? ? ? 應(yīng)的主文件是"main": "topology-vue.umd.js"】
? ?我在topology-vue.umd.js文件中執(zhí)行了：console.log('此文件被執(zhí)行了嗎？')這一行代碼
步驟四、手動(dòng)執(zhí)行命令創(chuàng)建 npx patch-package package-name 補(bǔ)丁文件
執(zhí)行命令：npx patch-package package-name，其中package-name指的是被修改的依賴包的名字（不是被修改的文件的名字）
例如，我要修改的是node_modules中topology-vue這個(gè)依賴
首先，我在package.json文件中找dependencies，在依賴中可以發(fā)現(xiàn)我安裝了topology-vue
其次，執(zhí)行命令：npx patch-package topology-vue
最后，項(xiàng)目根目錄中會(huì)自動(dòng)創(chuàng)建一個(gè) patches 文件夾，并且該文件夾中出現(xiàn)一個(gè) package-name+version.patch 的補(bǔ)丁文件，并發(fā)現(xiàn)該補(bǔ)丁文件下有console.log('此文件被執(zhí)行了嗎？')這一行代碼
步驟五、測(cè)試補(bǔ)丁文件是否可以生效
手動(dòng)刪除項(xiàng)目中的?node_modules 文件，并重新執(zhí)行 npm install 命令安裝?node_modules 依賴包
安裝成功后查看之前修改的?node_modules 依賴包中的文件，查看修改的代碼是否依然存在
如果之前修改的代碼依然存在，即表明補(bǔ)丁文件已經(jīng)生效
如果之前修改的代碼不存在，即表明補(bǔ)丁文件沒(méi)有生效
方法二：
步驟一：將node_modules 依賴包中的vue文件和要修改的依賴包同時(shí)拷貝存放在一個(gè)新的文件夾中
例如，我要修改topology-vue的源碼
將node_modules 依賴包中的vue和topology-vue文件同時(shí)拷貝存放到一個(gè)新的文件夾new_node_modules中
步驟二：將new_node_modules文件夾存放在根目錄下的static文件中
步驟三：在模板組件中按路徑引入、注冊(cè)
步驟四：測(cè)試拷貝出的源碼是否生效
手動(dòng)刪除項(xiàng)目中的?node_modules 文件
手動(dòng)刪除package.json文件中dependencies下的topology-vue依賴
并重新執(zhí)行 npm install 命令安裝?node_modules 依賴包
安裝成功后查看 node_modules 依賴包中的topology-vue文件是否依然存在
如果不存在，且程序運(yùn)行正常，即表明重新引入的文件已經(jīng)生效
如果存在，即表明重新引入的文件沒(méi)有生效
步驟五：使用第二種方法可能會(huì)導(dǎo)致依賴包太大，給項(xiàng)目的運(yùn)行帶來(lái)負(fù)擔(dān)
只需要拷貝主目錄文件下的壓縮文件
在模塊中按路徑引入壓縮文件，按步驟三注冊(cè)使用即可
