Skip to content

Use CSJS with duet by passing CSS Modules-enabled stylesheets from the worker thread to the main thread which are injected into the document's head.

Notifications You must be signed in to change notification settings

colingourlay/duet-csjs

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

duet-csjs

Use CSJS with duet by passing CSS Modules-enabled stylesheets from the worker thread to the main thread which are injected into the document's head.

$ npm install duet-csjs

Usage

var duet    = require('duet');
var channel = require('duet-csjs/channel');
var csjs    = require('duet-csjs');

var GREY = '#ccc';
var GREEN = '#3c3';

var styles = csjs`
    .button {
        display: inline-block;
        border-radius: 5px;
        background-color: ${GREY};
    }

    .sucess-button extends .button {
        background-color: ${GREEN};
    }
`;

duet([channel], function () {
    // styles were queued and sent once duet connected the channel
});

API

Please refer to the CSJS documentation. This plugin transparently wraps the existing API with a function that sends compiled styles from the worker thread to the main thread, where insert-css is used to insert them into the document's <head> as a <style> element.

Example

An example can be seen in the duet example app.

About

Use CSJS with duet by passing CSS Modules-enabled stylesheets from the worker thread to the main thread which are injected into the document's head.

Resources

Stars

Watchers

Forks

Packages

No packages published