項目中多個文件引入同一份公共樣式less文件導致編譯打包后有多份樣式

問題

項目為多頁面應用，每個頁面中都引入同一份公共樣式less文件導致編譯打包后有多份樣式，我使用的是less預編譯器。

解決

網上找到即為大佬的解決方案，真的非常好用，這里備忘一下。

主要解決方案為，使用less本身支持的 import的時候前面加（reference），只在入口js文件中引入一份不加（reference）的樣式文件即可,這樣webpack打包生成的只有這一份樣式。

作用：用 @import (reference)導入外部文件，不添加導入樣式編譯后的輸出。

參考鏈接

less關於reference文檔

https://axiu.me/coding/prevent-less-and-sass-common-part-generate-duplicate-css-code/

http://vlambda.com/wz_x1Ta06BPRV.html