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

    metalsmith-inline-css

    1.0.9 • Public • Published

    Build Status Coverage Status

    metalsmith-inline-css

    This is a Metalsmith plugin to inline CSS files. It is compatible with CSS preprocessor plugins (e.g. metalsmith-sass).

    Usage

    Install the package:

    npm install metalsmith-inline-css
    

    Add the plugin to your Metalsmith build chain:

    const metalsmith = require('metalsmith');
    const inlineCss = require('metalsmith-inline-css');
    
    metalsmith(__dirname)
        .source('./src')
        .destination('./public')
        .use(inlineCss());
        .build(function (err) {
            if (err) {
                throw err;
            }
    
            console.log('Build complete');
        });
    

    This plugin avoids the complexity of parsing the HTML tree by instead using simple RegEx search and replace.

    The downside is that you must format your <link> tag in one of the following two ways, or the plugin will not inline your CSS file:

    <link rel="stylesheet" href="/css/style.css" inline>
    - OR -
    <link rel=stylesheet href=/css/style.css inline>
    

    (Replace /css/style.css with the path to your CSS file relative to the output directory.)

    Example

    To build the example page run:

    make example
    

    Inspect files in example/ for more information.

    Debug Logging

    Set the DEBUG variable to see what the plugin is doing.

    DEBUG=metalsmith-inline-css:* node build.js
    

    Install

    npm i metalsmith-inline-css

    DownloadsWeekly Downloads

    4

    Version

    1.0.9

    License

    LGPL-3.0

    Unpacked Size

    12.1 kB

    Total Files

    5

    Last publish

    Collaborators

    • avatar