安装依赖
npm install less --save-dev
npm install sass-resources-loader --save-dev
build文件夹下修改如下
'use strict'
const path = require('path')
const config = require('../config')
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const packageConfig = require('../')
= function (_path) {
const assetsSubDirectory = .NODE_ENV === 'production'
?
:
return (assetsSubDirectory, _path)
}
= function (options) {
options = options || {}
const cssLoader = {
loader: 'css-loader',
options: {
sourceMap:
}
}
const postcssLoader = {
loader: 'postcss-loader',
options: {
sourceMap:
}
}
// generate loader string to be used with extract text plugin
function generateLoaders (loader, loaderOptions) {
const loaders = ? [cssLoader, postcssLoader] : [cssLoader]
if (loader) {
({
loader: loader + '-loader',
options: ({}, loaderOptions, {
sourceMap:
})
})
}
// Extract CSS when that option is specified
// (which is the case during production build)
if () {
return ({
use: loaders,
fallback: 'vue-style-loader'
})
} else {
return ['vue-style-loader'].concat(loaders)
}
}
// /en/configurations/
return {
css: generateLoaders(),
postcss: generateLoaders(),
less: generateLoaders('less').concat({
loader: 'sass-resources-loader',
options: {
resources: (__dirname, '../src/assets/')//这是全局变量文件的路径所有变量要放在这个文件中
}
}),
sass: generateLoaders('sass', { indentedSyntax: true }),
scss: generateLoaders('sass'),
stylus: generateLoaders('stylus'),
styl: generateLoaders('stylus')
}
}
// Generate loaders for standalone style files (outside of .vue)
= function (options) {
const output = []
const loaders = (options)
for (const extension in loaders) {
const loader = loaders[extension]
({
test: new RegExp('\\.' + extension + '$'),
use: loader
})
}
return output
}
= () => {
const notifier = require('node-notifier')
return (severity, errors) => {
if (severity !== 'error') return
const error = errors[0]
const filename = && ('!').pop()
({
title: ,
message: severity + ': ' + ,
subtitle: filename || '',
icon: (__dirname, '')
})
}
}
如果报错执行如下命令
npm install stylus-loader css-loader style-loader less-loader --save-dev