關於vue中node_modules中第三方模塊的修改使用


最近用vue在做一個項目,github用上找了一個日歷插件,intall到了本項目中,配好以后發現插件的樣式風格和項目總體風格相差較大,所以就像這個改一下插件風格,

第一種方法:我直接在父組件中將style標簽的scoped的屬性去掉了,在父組件中直接寫了想要的樣式,重疊樣式全部!important,結果確實生效了

 

第二種方法:本想這個要是樣式這么改,還有路可走;要是插件的底層方法呢,如果有對外開發的修改入口還行,要是沒有,可咋辦,於是想着能不能直接去改下這個插件,這樣直接一錘子到底,   

      在node_modules中直接找到了這個插件,查閱了這

      

剛開始直接啥也沒管,直接改了src下的文件死活不生效

 

最后看了下這個插件的package.json;一看,靠,原來主文件,是dist目錄下的index.js;這個是已經打好的用於生產環境的包,我改的src下的測試環境的文件,當然無效

 

怎么辦才能有效呢,當然是重新打包,問題的關鍵是怎樣在node_modules下在這個插件下重新build,查了這個插件下,根本沒有這個插件的node_modules依賴(插一句git文件到github時node_moudles文件是忽略的),所以在插件下直接npm run build各種報錯,

后來想了下,我把這個插件包拷出來,然后vs打開,不是沒有node_modules依賴嗎,有package.json。直接npm install ;這樣的package.json里面的標寫的依賴全部安裝,然后有了依賴,這時去改這個插件src下的文件;

改好所有的一切后直接npm run build;重新生成了新的dist 下的index.js;把這個新生成的index.js拷貝覆蓋到原來那個項目下對應的位置,覆蓋,這樣最后的效果妥妥額成功了!哈哈哈!!!

 

 

  總結一下:

      可以看下要修改的node_modules項目中的package.json,里面會有一個屬性,類似:

      "main": "dist/index.min.js",

      表示的是該項目的入口文件,我們日常開發的項目中引用的其實就是這一個文件,若是直接改這個index.min.js,重啟一下就能生效。

      PS: 不過一般入口文件都是打包后的js,很難直接改,都是改src目錄下的文件后重新build。

      --------------------問題的關鍵是怎樣在node_modules下在這個插件下build,查了這個插件下根本沒有這個插件的node_modules依賴,所以在插件下直接npm run build各種報錯,解決方法是拷貝出來改好后直接去覆蓋,

      --------------------一般不建議這么干,太暴力了,另外團隊協助時,其他隊友和服務器上的代碼不能保持一致

    

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM