From f15071cfa077fedcbf797730d6f1c7f7dd3e9fe4 Mon Sep 17 00:00:00 2001 From: AgufaGit <75498398+agufagit@users.noreply.github.com> Date: Wed, 22 Feb 2023 05:06:10 -0500 Subject: [PATCH] fix(vite): respect rollupoptions specified output dir in lib mode (#2231)Co-authored-by: Anthony Fu Co-authored-by: Anthony Fu --- packages/vite/src/modes/global/build.ts | 30 +++++++++- test/fixtures.test.ts | 32 +++++++++++ .../vite-lib-rollupoptions/index.html | 12 ++++ .../vite-lib-rollupoptions/lib/main.css | 8 +++ .../vite-lib-rollupoptions/lib/main.ts | 19 +++++++ .../vite-lib-rollupoptions/package.json | 8 +++ .../vite-lib-rollupoptions/unocss.config.ts | 22 ++++++++ .../vite-lib-rollupoptions/vite.config.ts | 56 +++++++++++++++++++ 8 files changed, 184 insertions(+), 3 deletions(-) create mode 100644 test/fixtures/vite-lib-rollupoptions/index.html create mode 100644 test/fixtures/vite-lib-rollupoptions/lib/main.css create mode 100644 test/fixtures/vite-lib-rollupoptions/lib/main.ts create mode 100644 test/fixtures/vite-lib-rollupoptions/package.json create mode 100644 test/fixtures/vite-lib-rollupoptions/unocss.config.ts create mode 100644 test/fixtures/vite-lib-rollupoptions/vite.config.ts diff --git a/packages/vite/src/modes/global/build.ts b/packages/vite/src/modes/global/build.ts index 93a9a808c4..4db5d00942 100644 --- a/packages/vite/src/modes/global/build.ts +++ b/packages/vite/src/modes/global/build.ts @@ -109,9 +109,33 @@ export function GlobalModeBuildPlugin(ctx: UnocssPluginContext } }, async configResolved(config) { - const distDir = resolve(config.root, config.build.outDir) - cssPostPlugins.set(distDir, config.plugins.find(i => i.name === 'vite:css-post')) - cssPlugins.set(distDir, config.plugins.find(i => i.name === 'vite:css')) + const distDirs = [ + resolve(config.root, config.build.outDir), + ] + + // for Vite lib more with rollupOptions.output, #2231 + if (config.build.rollupOptions.output) { + const outputOptions = config.build.rollupOptions.output + if (Array.isArray(outputOptions)) { + distDirs.push( + ...outputOptions.map(option => option.dir).filter(Boolean) as string[], + ) + } + else { + if (outputOptions.dir) + distDirs.push(outputOptions.dir) + } + } + + const cssPostPlugin = config.plugins.find(i => i.name === 'vite:css-post') + const cssPlugin = config.plugins.find(i => i.name === 'vite:css') + + if (cssPostPlugin) + distDirs.forEach(dir => cssPostPlugins.set(dir, cssPostPlugin)) + + if (cssPlugin) + distDirs.forEach(dir => cssPlugins.set(dir, cssPlugin)) + await ready }, // we inject a hash to chunk before the dist hash calculation to make sure diff --git a/test/fixtures.test.ts b/test/fixtures.test.ts index f4e8e8a528..e1fe531708 100644 --- a/test/fixtures.test.ts +++ b/test/fixtures.test.ts @@ -82,6 +82,38 @@ describe.concurrent('fixtures', () => { } }) + it('vite lib rollupOptions', async () => { + const root = resolve(__dirname, 'fixtures/vite-lib-rollupoptions') + await fs.emptyDir(join(root, 'dist')) + await build({ + root, + logLevel: 'warn', + }) + + const files = await fg(['dist/**/index.js'], { cwd: root, absolute: true }) + expect(files).toHaveLength(2) + + for (const path of files) { + const code = await fs.readFile(path, 'utf-8') + // basic + expect(code).contains('.text-red') + // transformer-variant-group + expect(code).contains('.text-sm') + // transformer-compile-class + expect(code).contains('.uno-tacwqa') + // transformer-directives + expect(code).not.contains('@apply') + expect(code).not.contains('--at-apply') + expect(code).contains('gap:.25rem') + expect(code).contains('gap:.5rem') + + // transformer-variant-group + expect(code).contains('text-sm') + // transformer-compile-class + expect(code).contains('uno-tacwqa') + } + }) + it('vue cli 4', async () => { const root = resolve(__dirname, '../examples/vue-cli4') await fs.emptyDir(join(root, 'dist')) diff --git a/test/fixtures/vite-lib-rollupoptions/index.html b/test/fixtures/vite-lib-rollupoptions/index.html new file mode 100644 index 0000000000..07f7d3c896 --- /dev/null +++ b/test/fixtures/vite-lib-rollupoptions/index.html @@ -0,0 +1,12 @@ + + + + + + + + +
+ + + diff --git a/test/fixtures/vite-lib-rollupoptions/lib/main.css b/test/fixtures/vite-lib-rollupoptions/lib/main.css new file mode 100644 index 0000000000..a12547aa62 --- /dev/null +++ b/test/fixtures/vite-lib-rollupoptions/lib/main.css @@ -0,0 +1,8 @@ +.foo { + @apply flex; + @apply gap-1; +} + +.bar { + --at-apply: gap-2; +} diff --git a/test/fixtures/vite-lib-rollupoptions/lib/main.ts b/test/fixtures/vite-lib-rollupoptions/lib/main.ts new file mode 100644 index 0000000000..6f89528653 --- /dev/null +++ b/test/fixtures/vite-lib-rollupoptions/lib/main.ts @@ -0,0 +1,19 @@ +import '@unocss/reset/tailwind.css' +import './main.css' +import 'uno.css' + +// @unocss-include +const html = String.raw +document.querySelector('#app')!.innerHTML = html` +
+

+ Red +

+

+ Green Large +

+

+ Blue Small +

+
+` diff --git a/test/fixtures/vite-lib-rollupoptions/package.json b/test/fixtures/vite-lib-rollupoptions/package.json new file mode 100644 index 0000000000..48e43bb1c3 --- /dev/null +++ b/test/fixtures/vite-lib-rollupoptions/package.json @@ -0,0 +1,8 @@ +{ + "version": "0.0.0", + "private": true, + "scripts": { + "dev": "vite", + "build": "vite build" + } +} diff --git a/test/fixtures/vite-lib-rollupoptions/unocss.config.ts b/test/fixtures/vite-lib-rollupoptions/unocss.config.ts new file mode 100644 index 0000000000..efc9d1f153 --- /dev/null +++ b/test/fixtures/vite-lib-rollupoptions/unocss.config.ts @@ -0,0 +1,22 @@ +import { + defineConfig, + presetAttributify, + presetIcons, + presetUno, + transformerCompileClass, + transformerDirectives, + transformerVariantGroup, +} from 'unocss' + +export default defineConfig({ + presets: [ + presetAttributify(), + presetUno(), + presetIcons(), + ], + transformers: [ + transformerCompileClass(), + transformerVariantGroup(), + transformerDirectives(), + ], +}) diff --git a/test/fixtures/vite-lib-rollupoptions/vite.config.ts b/test/fixtures/vite-lib-rollupoptions/vite.config.ts new file mode 100644 index 0000000000..1ca12366ff --- /dev/null +++ b/test/fixtures/vite-lib-rollupoptions/vite.config.ts @@ -0,0 +1,56 @@ +import { resolve } from 'path' +import { defineConfig } from 'vite' +import UnoCSS from '@unocss/vite' + +export default defineConfig({ + build: { + lib: { + entry: resolve(__dirname, 'lib/main.ts'), + name: 'MyLib', + }, + rollupOptions: { + external: ['vue'], + output: [ + { + dir: resolve(__dirname, 'dist/es'), + format: 'es', + entryFileNames: 'index.mjs', + assetFileNames: 'assets/mylib.css', + preserveModules: true, + preserveModulesRoot: resolve(__dirname, './'), + }, + { + dir: resolve(__dirname, 'dist/cjs'), + format: 'cjs', + entryFileNames: 'index.cjs', + assetFileNames: 'assets/mylib.css', + preserveModules: true, + preserveModulesRoot: resolve(__dirname, './'), + }, + { + globals: { + vue: 'Vue', + }, + dir: resolve(__dirname, 'dist/umd'), + format: 'umd', + entryFileNames: 'index.js', + name: 'MyLib', + }, + { + globals: { + vue: 'Vue', + }, + dir: resolve(__dirname, 'dist/iife'), + format: 'iife', + entryFileNames: 'index.js', + name: 'MyLib', + }, + ], + }, + sourcemap: true, + cssCodeSplit: true, + }, + plugins: [ + UnoCSS(), + ], +})