Description
What version of Tailwind CSS are you using?
3.1.0
What build tool (or framework if it abstracts the build tool) are you using?
- postcss:
8.4.14 - rollup-plugin-postcss:
4.0.2 - rollup:
2.75.6
What version of Node.js are you using?
v18.3.0
What browser are you using?
Firefox 101.0 (however, this isn't a styling issue, it's a build issue)
What operating system are you using?
Windows
Reproduction URL
https://github.com/t-mart/tailwindcss-postcss-plugin-repro
Follow the README.md instructions to reproduce (i.e. swap between 3.0.24 and 3.1.0)
Describe your issue
Version 3.1.0 no longer exports a Tailwind plugin function that can be passed to a Rollup PostCSS plugin, while 3.0.24 did.
Therefore, the following rollup configuration fails: (this is what's in the reproduction repo)
import { defineConfig } from "rollup";
import typescript from "@rollup/plugin-typescript";
import tailwindcss from "tailwindcss";
import postcss from "rollup-plugin-postcss";
export default async () =>
defineConfig({
input: "src/main.ts",
output: {
dir: "dist"
},
plugins: [
typescript({sourceMap: false}),
postcss({
plugins: [tailwindcss()], // This line causes failure in 3.1.0, but not in 3.0.24
}),
],
});Click to expand failure stack trace
[!] (plugin typescript) Error: @rollup/plugin-typescript TS2349: This expression is not callable.
Type 'typeof import("C:/Users/tim/code/tailwindcss-postcss-plugin-repro/node_modules/tailwindcss/types/index")' has no call signatures.
rollup.config.ts (15:19)
s-postcss-plugin-repro/node_modules/tailwindcss/types/index")' has no call signatures.
15 plugins: [tailwindcss()],
~~~~~~~~~~~
Error: @rollup/plugin-typescript TS2349: This expression is not callable.
Type 'typeof import("C:/Users/tim/code/tailwindcss-postcss-plugin-repro/node_modules/tailwindcss/types/index")' has no call signatures.
at error (C:\Users\tim\code\tailwindcss-postcss-plugin-repro\node_modules\rollup\dist\shared\rollup.js:198:30)
at throwPluginError (C:\Users\tim\code\tailwindcss-postcss-plugin-repro\node_modules\rollup\dist\shared\rollup.js:21936:12)
at Object.error (C:\Users\tim\code\tailwindcss-postcss-plugin-repro\node_modules\rollup\dist\shared\rollup.js:22659:20)
at emitDiagnostic (C:\Users\tim\code\tailwindcss-postcss-plugin-repro\node_modules\@rollup\plugin-typescript\dist\index.js:513:17)
at reportDiagnostics (C:\Users\tim\code\tailwindcss-postcss-plugin-repro\node_modules\@rollup\plugin-typescript\dist\index.js:521:9)
at Array.forEach (<anonymous>)
at emitFilesAndReportErrors (C:\Users\tim\code\tailwindcss-postcss-plugin-repro\node_modules\typescript\lib\typescript.js:123048:21)
at result.afterProgramCreate (C:\Users\tim\code\tailwindcss-postcss-plugin-repro\node_modules\typescript\lib\typescript.js:123228:13)
at Object.afterProgramCreate (C:\Users\tim\code\tailwindcss-postcss-plugin-repro\node_modules\@rollup\plugin-typescript\dist\index.js:676:29)
at synchronizeProgram (C:\Users\tim\code\tailwindcss-postcss-plugin-repro\node_modules\typescript\lib\typescript.js:123534:22)
I'm not sure if this is just a typescript thing. Perhaps this will work when https://www.npmjs.com/package/@types/tailwindcss is updated too?