前言：公司的首页大屏要求做三个分辨率的版本，分别是1920*1080、3840*2160、6240*2160。在最初的设计稿1920*1080版本和6240*2160版本还是相差很大，就没有做适配之类的，然后搭了三个项目。后面赶项目，说3840*2160版本的舍弃，保留1920*1080和6240*2160的，然后保留两版的展示内容也渐渐要求一致。在后面产品要求调整内容或者添加功能时，就想两个项目的js和html是一样，可不可以就一个项目，然后用一个参数控制引入不同版本的scss，以减少工作量。因为后面做着做着，又要把3840*2160版本的加上来，就把这个想法付出实践。
本来是打算用import()导入，不过一直报错”Cannot read property ‘range’of null”，就用require导入了。
使用require导入的样式，所以不存在单个vue文件独享的scss样式，会有少量同名的class样式会相互影响，即使两者前面有不同的class名做限制，只能设置不同的名字。在使用第三方提供的框架，少量样式无法使用渗透修改，比如字体颜色与大小，自己只好去实现这部分的内容。
本来打算直接全局混入的，Vue.mixins，结果报错，由于我部分文件也有用到mixins就只能一个个文件自己添加mixins，然后需要导入不同样式的vue文件里设置currentFileSrc的值为对应样式文件的路径。
因为是使用require导入的文件，第一点就不满足，。。。
一开始觉得打不打包两套样式文件无所谓，不打包只是性能没有那么好而已，直到打包让他们发布后才发现1920版本的样式应用了部分6240版本的样式，看着本地正常，线上样式错乱有点搞不懂。
后面想，本地使用动态引入，不会存在1920版本和6240版本样式混合在一起的状态。而webpack同时打包1920版本和6240版本的样式，两者对应的class名都是一样，所以样式是两者的混合。
以下内容为webpack不打包对应版本的尝试：
方法一：externals
externals是用来不打包模块、第三方库，不适用
方法二：copy-webpack-plugin
看了百度上的描述，其作用是不打包直接输出到打包后的文件夹下，不适用。
就可以正常加载了，不理解。。。
感觉这些路径都少了\\来代表过滤的文件夹，因为6240版本使用的scss文件放在index6240文件夹下，webpack会不会过滤掉了以....\\index为前缀的文件，包括...\\index6420\\？后面给路径加上\\，打包后发布，6240版本的样式正常了。
