fix(css): missing css in lib mode (#10185)

This commit is contained in:
Dunqing 2022-09-25 21:46:49 +08:00 committed by GitHub
parent 9acb839157
commit e4c1c6d506
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 35 additions and 1 deletions

View File

@ -563,7 +563,7 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin {
// the legacy build should avoid inserting entry CSS modules here, they
// will be collected into `chunk.viteMetadata.importedCss` and injected
// later by the `'vite:build-html'` plugin into the `index.html`
if (chunk.isEntry) {
if (chunk.isEntry && !config.build.lib) {
return null
}
chunkCSS = await finalizeCss(chunkCSS, true, config)

View File

@ -22,4 +22,15 @@ describe('vue component library', () => {
expect(code).toContain('styleA') // styleA is used by CompA
expect(code).not.toContain('styleB') // styleB is not used
})
test('should inject css when cssCodeSplit = true', async () => {
// Build lib
const { output } = (
await build({
logLevel: 'silent',
configFile: path.resolve(__dirname, '../vite.config.lib-css.ts')
})
)[0]
expect(output[0].code).toContain('.card{padding:4rem}')
})
})

View File

@ -5,6 +5,7 @@
"scripts": {
"dev-consumer": "vite --config ./vite.config.consumer.ts",
"build-lib": "vite build --config ./vite.config.lib.ts",
"build-lib-css": "vite build --config ./vite.config.lib-css.ts",
"build-consumer": "vite build --config ./vite.config.consumer.ts"
},
"dependencies": {

View File

@ -0,0 +1,3 @@
.card {
padding: 4rem;
}

View File

@ -0,0 +1,3 @@
import './index.css'
export function setup() {}

View File

@ -0,0 +1,16 @@
import path from 'node:path'
import { defineConfig } from 'vite'
export default defineConfig({
root: __dirname,
build: {
outDir: 'dist/lib',
cssCodeSplit: true,
lib: {
entry: path.resolve(__dirname, 'src-lib-css/index.ts'),
name: 'index',
formats: ['umd'],
fileName: 'index.js'
}
}
})