Nuclear Pumpkin Mocha

    vue-cli-plugin-sugarss

    0.1.13 • Public • Published

    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:

    vue add sugarss

    Usage

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

    <style lang="sss">
     
    body
      color: red
     
    </style>

    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:

    $ npm i -D <plugin>
    $ npm i -D <another-plugin>
    // 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('<plugin>'),
                require('<another plugin>')
              );
     
              // You can change or set any property
              // opts.parser = 'sugarss';
     
              return opts;
            });
      }
    }

    postcss-nested & postcss-nested-props

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

    Install

    npm i vue-cli-plugin-sugarss

    DownloadsWeekly Downloads

    215

    Version

    0.1.13

    License

    ISC

    Unpacked Size

    2.82 kB

    Total Files

    4

    Last publish

    Collaborators

    • cxsper