📝 Rename css classes and id's in files
Clone or download
Permalink
Failed to load latest commit information.
docs/api Feat: rcs.process.pug (closes #22) (#29) Aug 28, 2018
lib
test
.babelrc
.eslintrc.js
.gitignore
.npmignore added npmignore Oct 30, 2016
.travis.yml
CHANGELOG.md
LICENSE
README.md
index.js Feat: rcs.process.pug (closes #22) (#29) Aug 28, 2018
package.json 3.1.1 Sep 1, 2018
yarn.lock Chore: update rcs-core to 2.4.1 Sep 1, 2018

README.md

Rename CSS Selectors (RCS)

Build Status Coverage Status

Note: Please make sure your files are not minified/uglified. Do that after processing it with rename-css-selectors

This module renames all CSS selectors in the given files. It will collect all selectors from the given CSS files. Do not worry about your selectors, rcs will do it for you.

You can also use a config file with the combination of generateMapping and loadMapping, if you already had other projects with the same classes. So all your projects have the same minified selector names - always.

Contents

Installation

Install with npm or yarn

npm install --save rename-css-selectors

or

yarn add rename-css-selectors

Usage

Async:

There are 3 different ways of writing async rcs code: callbacks, promises and async/await

const rcs = require('rename-css-selectors')

// if you want to include the .rcsrc config
rcs.includeConfig();

// if you have some generated mappings - load them!
// you can also specify the string although it does not exist yet.
rcs.loadMapping('./renaming_map.json');

// callback
rcs.process.auto(['**/*.js', '**/*.html', '**/*.css'], options, (err) => {
    // all css files are now saved, renamed and stored in the selectorLibrary
    // also other files are not renamed
    // that's it

    // maybe you want to add the new selectors to your previous generated mappings
    // do not worry, your old settings are still here, in case you used `loadMapping`
    rcs.generateMapping('./', { overwrite: true }, (err) => {
        // the mapping file is now saved
    });
});

// promise
rcs.process.auto(['**/*.js', '**/*.html', '**/*.css'], options)
    .then(() => rcs.generateMapping('./', { overwrite: true }))
    .catch(console.error);

// async/await
(async () => {
    try {
        await rcs.process.auto(['**/*.js', '**/*.html', '**/*.css'], options);
        await rcs.generateMapping('./', { overwrite: true });
    } catch (err) {
        console.error(err);
    }
})();

Sync:

const rcs = require('rename-css-selectors');

rcs.loadMapping('./renaming_map.json');

try {
    rcs.process.autoSync(['**/*.js', '**/*.html', '**/*.css'], options);
    rcs.generateMappingSync('./', { overwrite: true });
} catch (err) {
    console.error(err);
}

Methods

LICENSE

MIT © Jan Peer Stöcklmair