Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

    postcss-remove-globalpublic

    postcss-remove-global Build Status

    PostCSS plugin to remove :global identifier from your stylesheet files.

    Support three cases

    1. Remove :global as a single selector
    :global {
        a { }
    }
    a { }
    1. Remove :global as part of a selecotr
    .root :global .text { margin: 0 6px; }
    .root .text { margin: 0 6px; }
    1. Remove :global as part of params of @keyframe
    @keyframes :global(zoomIn{ }
    @keyframes zoomIn { }

    Usage

    Use with PostCSS API

    const postcss = require('postcss')
    const removeGlobal = require('postcss-remove-global')
     
    const css = postcss()
      .use(removeGlobal())
      .process(':global { a {color: gray(85); background-color: gray(10%, .25)}}')
      .css
    console.log('css = ', css)
    //= 'a {color: gray(85); background-color: gray(10%, .25)}'
     
    const css2 = postcss([removeGlobal])
      .process('.root :global .text { margin: 0 6px; }')
      .css
    console.log('css2 = ', css2)
    //= '.root .text { margin: 0 6px; }'
     
    const css3 = postcss([removeGlobal])
      .process('@keyframes :global(zoomIn) { }')
      .css
    console.log('css3 = ', css3)
    //= '@keyframes zoomIn { }'

    Reference:https://github.com/princetoad/try-postcss/blob/master/src/Plugin/plugin-remove-global.js

    Use gulp task runner

    gulp.task('global', () => {
      return gulp.src('assets/*.css')
        .pipe(postcss([removeGlobal]))
        .pipe(gulp.dest('build/'))
    })

    Reference:https://github.com/princetoad/try-postcss/blob/master/gulpfile.js

    install

    npm i postcss-remove-global

    Downloadsweekly downloads

    4

    version

    0.1.1

    license

    MIT

    repository

    githubgithub

    last publish

    collaborators

    • avatar