How do I use TailwindCSS in JavaScript?

[User-Clb]

The operating environment is :
Bun.js v1.1.42 (Windows x64)
"tailwindcss": "^4.0.8",
"@tailwindcss/postcss": "^4.0.8"
"postcss": "^8.5.3"

==============================================

`import tailwindcss from '@tailwindcss/postcss';
import postcss from 'postcss';

const options = {
// base: './',
optimize: {
minify: true
}
};

const css = `
@import "tailwindcss";
.new_class {
@apply bg-pink-500;
font-size: 16px;
}

`

postcss([tailwindcss(options)])
.process(css, { from: undefined })
.then(result => {
console.log(result.css);
})
.catch(error => {
console.error(error);
});`

---

[Running] bun run "xxxx\test\test.js"
559 | /
560 | const finishWithoutResolve = log => {
561 | /*
562 | * @type {ErrorWithDetail}
563 | */
564 | const error = new Error("Can't " + message);
^
error: Can't resolve 'tailwindcss' in 'xxxx'
at finishWithoutResolve (xxxx\test\node_modules\enhanced-resolve\lib\Resolver.js:564:18)
at xxxx\test\node_modules\enhanced-resolve\lib\Resolver.js:718:5
at xxxx\test\node_modules\enhanced-resolve\lib\Resolver.js:718:5
at xxxx\test\node_modules\enhanced-resolve\lib\Resolver.js:718:5
at xxxx\test\node_modules\enhanced-resolve\lib\Resolver.js:718:5
at xxxx\test\node_modules\enhanced-resolve\lib\Resolver.js:718:5

[wongjn]

You may need to set the from member of the options object in the .process() call to some real path in the project, so that @import "tailwindcss"; resolves properly.

[User-Clb]

const options = {
base: './src', // or base: './'
optimize: {
minify: true
}
}; Even if it is written like this, it is the same problem.

[User-Clb]

I see, thank you very much for the reminder, I ignored .process(css, { from: "input.css",to:"output.css" })

[wongjn]

You may need to set the from member of the options object in the .process() call to some real path in the project, so that @import "tailwindcss"; resolves properly. I wasn't referring to the base parameter in the options object passed to the tailwindcss function.