vue-cli-plugin-sugarss

SugarSS support for the projects created with @vue/cli. Lints SASS and Stylus.

Installation

According to this you are able to install community plugins as follows:

``shell
vue add sugarss
`

Usage

You can just go with file.sss and/or style[lang=sss] as it is shown below.

`html

`

PostCSS plugins

This plugin use it's custom webpack rule named sss. So in order to add some options (including plugins) to postcss-loader (or vue-style-loader, or css-loader) you need chain existing webpack rule in vue.config.js like this:

`bash
$ npm i -D
$ npm i -D
`

`javascript
// vue.config.js
module.exports = {
chainWebpack: config => {
config.module.rule('sss')
.use('postcss-loader')
.loader('postcss-loader')
.tap(opts => {
opts.plugins.push(
// in some order you want
require(''),
require('')
);

// You can change or set any property
// opts.parser = 'sugarss';

return opts;
});
}
}
`

$3

You should require('post-css-nested-props') before require('postcss-nested')` when pushing them to plugins.