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
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
});
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.
An example can be seen in the duet example app.