less
安装
npm install less@3.9.0 -s
npm install less-loader@5.0.0 -s

或者
npm install less@3.12.2 -s
npm install less-loader@4.1.0 -s

配置

打开：/build/webpack.base.conf.js  搜索 rules在数组中添加
	{
		test: /\.less$/,
		loader: 'style-loader!css-loader!less-loader'
	},

直接安装最新版的less会报错。我先阶段一直使用的这几个版本的
Sass
安装
npm install style-loader node-sass --save-dev
npm install sass-loader@7.0.1 -s

配置

打开：/build/webpack.base.conf.js  搜索 rules在数组中添加
{
	 test: /\.sass$/,
	 loaders: ['style', 'css', 'sass']
},

新版本的 vue-cli 自带 sass 所以可以不用添加该配置
如果发现引入报错，请注意各npm包的版本！
点赞、收藏、关注。

这个过程真是艰苦

东搞搞西搞

注意：1、此为vue cil 2.x版本的配置

 

最后的解决办法是

需要安装sass-resources-loader。

找到build文件夹下面的utils.js 找到 

less: generateLoaders('less') 修改成

less: generateLoaders('less').concat({

loader: 'sass-resources-loader',

options: {

resources: path.resolve(__dirname, '../src/assets/css/1.less')

}

}), 1.less就是你全局文件



less: generateLoaders('less').concat({

      loader: 'sass-resources-loader',
      options: {
        resources: path.resolve(__dirname, '../src/assets/css/dark/dark.less')
      }
  }),

vue+webview+less 实现夜间模式换肤功能

安装
npm install style-resources-loader vue-cli-plugin-style-resources-loader less-loader less -S

第一种方法（推荐）
// vue.config.js文件中的配置
const path = require('path');
module.exports = {
pluginOptions: {
    'style-resources-loader': {
      preProcessor: 'less',
      patterns: [
        path.resolve(__dirname, './src/assets/common/global.less')
      ]
    }
  }
}

第二种方法
安装 npm i style-resources-loader -D

// vue.config.js文件中的配置
const path = require('path') 
module.exports = {
    chainWebpack: config => {
        const types = ['vue-modules', 'vue', 'normal-modules', 'normal']
        types.forEach(type =>     
        addStyleResource(config.module.rule('less').oneOf(type)))
    }
}
 
// add style resource
function addStyleResource(rule) {
  rule.use('style-resource')
    .loader('style-resources-loader')
    .options({
      patterns: [path.resolve(__dirname, "./src/assets/common/global.less")]
    })
}

1. 引入loader
vue add style-resources-loader

2. 配置vue.config.js
1 // vue.config.js
 2 const path = require("path");
 3 module.exports = {
 4     pluginOptions: {
 5         "style-resources-loader": {
 6             preProcessor: "less",
 7             patterns: [path.resolve(__dirname, "less文件路径")]
 8         }
 9     }
10 };