Skip to content

v0.3.0

Compare
Choose a tag to compare
@mayank99 mayank99 released this 29 Jan 21:31
· 31 commits to main since this release

This release includes two new experimental features 🎈

  • New classNamePrefix option to allow customizing the prefix for hashed class names.
  • Support for using css in .astro files (frontmatter only).

That means you can now do this in your config:

plugins: [ecsstatic({ classNamePrefix: 'poop' })]

and use it in an astro file:

---
import { css } from '@acab/ecsstatic';
const heading = css`
  color: hotpink;
`;
---
<h1 class={heading}>Hello</h1>

which will output:

<h1 class='poop-1bh9win'>Hello</h1>
.poop-1bh9win {
  color: hotpink;
}

While this in itself is not very useful (because astro already has scoped styles), a more interesting use case is when you need to import styles already defined in a different .ts/.js file.

---
import { heading } from '../shared/styles.js';
---
<h1 class={heading}>Hello</h1>

Also, there is one breaking change: the evaluateExpressions option has been removed. This hopefully shouldn't affect anyone because its default value was true, and it had no effect when the template strings didn't contain interpolated expressions.