Server-Side Rendering

In non-browser environments, nano-css accumulates CSS as a string in the raw property instead of injecting into the DOM.


html += `<style>${nano.raw}</style>`;

Re-hydrating

Install the hydrate addon and provide your style sheet element:


const nano = create({
  sh: typeof document === 'object'
    ? document.getElementById('nano-css')
    : null,
});

nano-css will skip CSS rules that are already present in the style sheet.

Use the extract addon to extract styles into an external CSS file at build time.