vue sass 安装

1、node 安装依赖

npm install node-sass --save-dev

npm install sass-loader --save-dev

2、sass全局引用

npm install --save-dev sass-resources-loader

配置build/utils.js

function resolveResource(name) {

return path.resolve(__dirname, '../static/style/' + name);

}

function generateSassResourceLoader() {

var loaders = [

cssLoader,

    'sass-loader',

    {

loader:'sass-resources-loader',

      options: {

// 多个文件时用数组的形式传入，单个文件时可以直接使用path.resolve(__dirname, '../static/style/blog.scss'

        resources: [resolveResource('blog.scss')]

}

}

];

  if (options.extract) {

return ExtractTextPlugin.extract({

use: loaders,

      fallback:'vue-style-loader'

    })

}else {

return ['vue-style-loader'].concat(loaders)

}

}

return {

css:generateLoaders(),

  postcss:generateLoaders(),

  less:generateLoaders('less'),

  // sass: generateLoaders('sass', { indentedSyntax: true }),

// scss: generateLoaders('sass'),

//配置sass-resources-loader

  sass:generateSassResourceLoader(),

  scss:generateSassResourceLoader(),

  stylus:generateLoaders('stylus'),

  styl:generateLoaders('stylus')

}