Can't access tailwind values

Following bud-tailwindcss docs I can’t retrieve any value:

// bud.config.mjs
// any .ts or .vue file
import {xl} from '@tailwind/screens';
console.log(xl); // => undefined

I’m I missing something ?

1 Like

From the docs, it does seem like that should work. We’re using this functionality, but have specified a config key.

Do you have any success with the following?


1 Like

It doesn’t work either :s

Did you find a solution?
Get the same problem, but if you import the whole object it works fine.

import screens from '@tailwind/screens';


However, I can’t seem to get the extended values set in tailwind.config.js

From @kellymears via our Discord server:

So far I have been unable to reproduce an issue with this functionality.
added the following to bud.config.js:

app.tailwind.generateImports([`colors`, `lineHeight`])

then in resources/scripts/app.js:

import colors from '@tailwind/colors';
import lineHeight from '@tailwind/lineHeight';

console.log([`600`], lineHeight.none);

which seems to work. excerpt from compilation:

// ...
    './scripts/app.js': function () {
      console.log('#2563eb', '1');
// ...

i tried it using a tailwind config set in bud.config.js and it seems to also work:

    content: ['./index.php'],
    theme: {
      extend: {
        colors: {},
    plugins: [],
  .generateImports([`colors`, `lineHeight`]);

Upgrading to BudJS 6.20.0 solved it for me.

1 Like