mirror of
https://github.com/tailwindlabs/tailwindcss.git
synced 2025-12-08 21:36:08 +00:00
3f85b74611
When your Vite or postcss project has multiple Tailwind CSS roots with different configs, they should not influence each other (with the exception of the same candidates being used).
51 lines
1.4 KiB
TypeScript
51 lines
1.4 KiB
TypeScript
import { candidate, css, html, js, json, test } from '../utils'
|
|
|
|
test(
|
|
'production build',
|
|
{
|
|
fs: {
|
|
'package.json': json`
|
|
{
|
|
"dependencies": {
|
|
"postcss": "^8",
|
|
"postcss-cli": "^10",
|
|
"tailwindcss": "workspace:^",
|
|
"@tailwindcss/postcss": "workspace:^"
|
|
}
|
|
}
|
|
`,
|
|
'postcss.config.js': js`
|
|
module.exports = {
|
|
plugins: {
|
|
'@tailwindcss/postcss': {},
|
|
},
|
|
}
|
|
`,
|
|
'index.html': html`
|
|
<div class="one:underline two:underline"></div>
|
|
`,
|
|
'src/shared.css': css`
|
|
@import 'tailwindcss/theme' theme(reference);
|
|
@import 'tailwindcss/utilities';
|
|
`,
|
|
'src/root1.css': css`
|
|
@import './shared.css';
|
|
@variant one (&:is([data-root='1']));
|
|
`,
|
|
'src/root2.css': css`
|
|
@import './shared.css';
|
|
@variant two (&:is([data-root='2']));
|
|
`,
|
|
},
|
|
},
|
|
async ({ fs, exec }) => {
|
|
await exec('pnpm postcss src/*.css -d dist')
|
|
|
|
await fs.expectFileToContain('dist/root1.css', [candidate`one:underline`])
|
|
await fs.expectFileNotToContain('dist/root1.css', [candidate`two:underline`])
|
|
|
|
await fs.expectFileNotToContain('dist/root2.css', [candidate`one:underline`])
|
|
await fs.expectFileToContain('dist/root2.css', [candidate`two:underline`])
|
|
},
|
|
)
|