Browser integration

Stylify can be used directly in the browser using CDN or imported as a module.

This setup is great for a quick setup when you want for example to build a single page or dont want to use bundlers or node at all.

Integration example for browser can be found in integrations examples repository .

For production purposes, use correct version instead of the latest. Otherwise, during the request for the file, there will be an internal redirect in the CDN in order to get the correct version which will increase the page loading time.

<script src="https://cdn.jsdelivr.net/npm/@stylify/stylify@latest/dist/stylify.native.min.js"></script>

<script>
Stylify.configure({
    // ...
    compiler: {
        // ...
    }
})
</script>
import { Runtime, nativePreset } from '@stylify/stylify';

// Optional configuration
nativePreset.compiler.variables = {
    blue: 'steelblue'
}
// ...

new Runtime(nativePreset);

Configuration

The example above uses the @stylify/stylify package. More precisely its Runtime component. The configuration for the Stylify can be found on the Compiler and the Runtime documenation pages.