vue-cli3 + webpack4 搭建换肤功能

项目中有个一键换肤的功能，百度后发现有很多demo，最终采用style-loader方式

由于使用vue-cli3创建的项目，对webpack配置都进行封装了，导致使用起来极度不习惯

原文作者是使用sass的，改成相应less方式

    // 换肤loader
    const less = config.module.rule('less').toConfig();
    const useable = { ...less.oneOf[3], test: /\.useable\.less$/ };
    useable.use = [...useable.use];
    useable.use[0] = { loader: "style-loader/useable"}         
      ;//style-loader/url 找不到对应loader
    config.module.rule('less').merge({ oneOf: [useable] });

项目运行时始终报错找不到对应的loader，百度一圈也没对应解决方法

最后在style-loader上找到解决方案

useable.use[0] = { loader: "style-loader", options: { injectType: 'lazyStyleTag' } } ;//style-loader/url 找不到对应loader

不采用style-loader/useable而使用style-loader，并添加options: { injectType: 'lazyStyleTag' }

style-loader地址：https://github.com/webpack-contrib/style-loader

原文作者：https://www.cnblogs.com/webSciprt/p/ji-yuwebpack4vuecli3xiang-mu-de-huan-fu-gong-neng.html