Have ideas to improve npm?Join in the discussion! »

    express-slick-css

    1.0.0 • Public • Published

    Slick CSS 🎈

    CircleCI codecov tested with jest

    No more bloated CSS styles 💩 in your websites.

    How it works?

    1. It intercepts the res.render method in the express framework
    2. Strips out all the stylesheets from the html document
    3. Extracts only used styles using uncss
    4. Creates a new stylesheet in the path specified(cssPath) and caches it
    5. Adds the newly created stylesheet to the html document
    6. Send the response

    How to use it?

    1. Install the package
    npm install express-slick-css --save
    1. Add all the stylesheets to the layout
    ...
    <!-- rel='stylesheet' must be there otherwise it won't be picked up -->
    <link href='/stylesheets/style.css' rel='stylesheet'>
    ...
    1. Add the middleware before all the routes
    const slickify = require('express-slick-csss');
    ...
    app.use(slickify(options));
    ...
    app.use('/', indexRoutes);

    Options

    Options Description Mandatory Default Value
    outputPath path to save the new slick stylesheets Yes N/A
    cssPath path to look for stylesheets specified in link tag No outputPath
    publicPath public path for serving css asset eg. href="/css/style.css" No '/'
    uncssOptions Supports all the options provided by uncss No Refer uncss

    Example

    app.use(
      slickify({
        cssPath: path.join(__dirname, 'css'),
        // outputPath must exists
        // Add the outputPath to .gitignore if you want
        outputPath: path.join(__dirname, 'slick-css'),
        publicPath: '/stylesheets/',
        uncssOptions: {
          // Include global CSS frameworks here to keep it clean
          stylesheets  : ['lib/bootstrap/dist/css/bootstrap.css']
        }
      });
    );

    How to contribute?

    Feel free to create an issue for a feature request, bug and you can take up any of those to make a pull request

    Show your support by ⭐️ the repo

    License

    MIT © Ameer Jhan

    Install

    npm i express-slick-css

    DownloadsWeekly Downloads

    1

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    29.5 kB

    Total Files

    24

    Last publish

    Collaborators

    • avatar