diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts index ef0f7404763f73..bfe60ed04dc529 100644 --- a/packages/vite/src/node/plugins/css.ts +++ b/packages/vite/src/node/plugins/css.ts @@ -426,7 +426,11 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin { code = `export default ${JSON.stringify(content)}` } } else { - code = `export default ''` + // if moduleCode exists return it **even if** it does not have `?used` + // this will disable tree-shake to work with `import './foo.module.css'` but this usually does not happen + // this is a limitation of the current approach by `?used` to make tree-shake work + // See #8936 for more details + code = modulesCode || `export default ''` } return { diff --git a/playground/css/__tests__/css.spec.ts b/playground/css/__tests__/css.spec.ts index 5b7114c07f46cd..57b75599150ea8 100644 --- a/playground/css/__tests__/css.spec.ts +++ b/playground/css/__tests__/css.spec.ts @@ -349,8 +349,7 @@ test('PostCSS dir-dependency', async () => { } }) -// skip because #8278 is reverted -test.skip('import dependency includes css import', async () => { +test('import dependency includes css import', async () => { expect(await getColor('.css-js-dep')).toBe('green') expect(await getColor('.css-js-dep-module')).toBe('green') }) @@ -437,9 +436,9 @@ test('PostCSS source.input.from includes query', async () => { ) }) -// skip because #8278 is reverted -test.skip('aliased css has content', async () => { +test('aliased css has content', async () => { expect(await getColor('.aliased')).toBe('blue') - expect(await page.textContent('.aliased-content')).toMatch('.aliased') + // skipped: currently not supported see #8936 + // expect(await page.textContent('.aliased-content')).toMatch('.aliased') expect(await getColor('.aliased-module')).toBe('blue') })