roots/bud
### [`v6.4.3`](https://togithub.com/roots/bud/releases/tag/v6.4.3)
[Compare Source](https://togithub.com/roots/bud/compare/v6.4.2...v6.4.3)
Release notes are also [available on bud.js.org](https://bud.js.org/blog/6.4.3)
#### 🩹 fix: [@roots/sage](https://bud.js.org/extensions/sage) errors logged when not using tailwindcss
Errors no longer reported when not using tailwindcss in a [@roots/sage](https://bud.js.org/extensions/sage) project.
#### 🩹 fix: [@roots/sage](https://bud.js.org/extensions/sage) `bud.wpjson` doesn't generate colors
Colors now generated for `theme.json` when using `bud.wpjson.useTailwindColors()`
#### ✨ feature: [@roots/bud-tailwindcss](https://bud.js.org/extensions/bud-tailwindcss) reference tailwindcss values in js files
You can now easily use tailwind theme values in your app code by importing them from the (virtual) `@tailwind/*` alias.
An example:
```ts
import {black} from '@tailwind/colors'
import {sans} from '@tailwind/fontFamily'
export const main = () => {
document.body.style.backgroundColor = black
document.body.style.fontFamily = sans
}
```
Generating the imports can be memory intensive and increase build times, so it is opt-in.
```ts
app.tailwind.generateImports()
```
Better to generate imports only for specific keys (much less memory intensive):
```ts
app.tailwind.generateImports([`colors`, `fontFamily`])
```
This is a lot better than trying to import the actual `tailwind.config.js` file to read these values as the values are fully resolved (merged with `defaultTheme`, plugins applied, etc.)
And it's a lot better than importing `tailwindcss/resolveConfig` and doing it in the app code because of the transitive dependencies taken on by that import.
It's also better than pre-compiling a static json file because these values are tree-shakeable. The entire generated json for the default tailwind config is ~100kb.
The above example adds ~5kb to the overall bundle (and only because tailwind has so many default colors). If you use terser ([bud.minify](https://bud.js.org/docs/bud.minimize)) the difference is entirely negligible.
#### ℹ️ Release information
For more information [review the diff to see what's changed](https://togithub.com/roots/bud/compare/v6.4.0...v6.4.3).
Configuration
📅 Schedule: Branch creation - "before 2am" in timezone America/Los_Angeles, Automerge - At any time (no schedule defined).
🚦 Automerge: Enabled.
♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.
🔕 Ignore: Close this PR and you won't be reminded about these updates again.
[ ] If you want to rebase/retry this PR, click this checkbox.
This PR has been generated by Mend Renovate. View repository job log here.
This PR contains the following updates:
6.4.2->6.4.36.4.2->6.4.36.4.2->6.4.3Release Notes
roots/bud
### [`v6.4.3`](https://togithub.com/roots/bud/releases/tag/v6.4.3) [Compare Source](https://togithub.com/roots/bud/compare/v6.4.2...v6.4.3) Release notes are also [available on bud.js.org](https://bud.js.org/blog/6.4.3) #### 🩹 fix: [@roots/sage](https://bud.js.org/extensions/sage) errors logged when not using tailwindcss Errors no longer reported when not using tailwindcss in a [@roots/sage](https://bud.js.org/extensions/sage) project. #### 🩹 fix: [@roots/sage](https://bud.js.org/extensions/sage) `bud.wpjson` doesn't generate colors Colors now generated for `theme.json` when using `bud.wpjson.useTailwindColors()` #### ✨ feature: [@roots/bud-tailwindcss](https://bud.js.org/extensions/bud-tailwindcss) reference tailwindcss values in js files You can now easily use tailwind theme values in your app code by importing them from the (virtual) `@tailwind/*` alias. An example: ```ts import {black} from '@tailwind/colors' import {sans} from '@tailwind/fontFamily' export const main = () => { document.body.style.backgroundColor = black document.body.style.fontFamily = sans } ``` Generating the imports can be memory intensive and increase build times, so it is opt-in. ```ts app.tailwind.generateImports() ``` Better to generate imports only for specific keys (much less memory intensive): ```ts app.tailwind.generateImports([`colors`, `fontFamily`]) ``` This is a lot better than trying to import the actual `tailwind.config.js` file to read these values as the values are fully resolved (merged with `defaultTheme`, plugins applied, etc.) And it's a lot better than importing `tailwindcss/resolveConfig` and doing it in the app code because of the transitive dependencies taken on by that import. It's also better than pre-compiling a static json file because these values are tree-shakeable. The entire generated json for the default tailwind config is ~100kb. The above example adds ~5kb to the overall bundle (and only because tailwind has so many default colors). If you use terser ([bud.minify](https://bud.js.org/docs/bud.minimize)) the difference is entirely negligible. #### ℹ️ Release information For more information [review the diff to see what's changed](https://togithub.com/roots/bud/compare/v6.4.0...v6.4.3).Configuration
📅 Schedule: Branch creation - "before 2am" in timezone America/Los_Angeles, Automerge - At any time (no schedule defined).
🚦 Automerge: Enabled.
♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.
🔕 Ignore: Close this PR and you won't be reminded about these updates again.
This PR has been generated by Mend Renovate. View repository job log here.