项目中多个文件引入同一份公共样式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