Now Package More

    rcs-core

    3.7.1 • Public • Published

    rcs-core

    Build Status Coverage Status

    rcs is short for rename css selectors

    Why?

    Having long CSS selectors, such as main-menu__item--disabled, can increase the filesizes. With this rcs-core it is easy to rename the selectors and therefore reduce the filesize. You can save around 20% of the filesize by just shorten the CSS selectors in the CSS files.

    What does it do?

    It basically just rename/minify all CSS selectors in all files. First the library has to be trained with selectors. Based on this data, the selectors can be renamed in all files. Here are some examples made with Bootstrap files.

    Some live projects:

    Caveats

    Correctly using rcs-core or any of its plugins on large project means few rules should be followed.

    This document explains most of them.

    Installation

    $ npm install --save rcs-core

    or

    $ yarn add rcs-core

    Usage

    Note couple of selectors are excluded by default. You can activate them by using .setInclude before you fill the library

    1. Fill your library with all selectors (we assume there is just one CSS file)
    // excluding specific selectors
    rcs.selectorsLibrary.setExclude('selector-to-ignore');
    // include specific selectors which has been ignored by default
    rcs.selectorsLibrary.setInclude('center');
    
    rcs.fillLibraries(fs.readFileSync('./src/styles.css', 'utf8'));
    1. Optimize the selectors compression (optional)
    rcs.optimize();
    1. Rewrite all files

    Note: Do not forget to replace your CSS file

    const css = rcs.replace.css(fs.readFileSync('./src/styles.css', 'utf8'));
    const js = rcs.replace.js(fs.readFileSync('./src/App.js', 'utf8'));
    const html = rcs.replace.html(fs.readFileSync('./src/index.html', 'utf8'));
    
    // output some warnings which has been stacked through the process
    rcs.warnings.warn();
    
    fs.writeFileSync('./dist/styles.css', css);
    fs.writeFileSync('./dist/App.js', js);
    fs.writeFileSync('./dist/index.html', html);

    API documentation

    Plugins

    Install

    npm i rcs-core

    DownloadsWeekly Downloads

    324

    Version

    3.7.1

    License

    MIT

    Unpacked Size

    123 kB

    Total Files

    82

    Last publish

    Collaborators

    • jpeer