fix(css): spread lightningcss options (#14024)

Co-authored-by: Arnaud Barré <[email protected]>

Author: bru02

packages/vite/api-extractor.json

@@ -5,8 +5,6 @@
 
   "mainEntryPointFilePath": "./temp/node/index.d.ts",
 
-  "bundledPackages": ["lightningcss"],
-
   "dtsRollup": {
     "enabled": true,
     "untrimmedFilePath": "",

packages/vite/package.json

@@ -57,7 +57,7 @@
     "build-types": "run-s build-types-temp build-types-pre-patch build-types-roll build-types-post-patch build-types-check",
     "build-types-temp": "tsc --emitDeclarationOnly --outDir temp/node -p src/node",
     "build-types-pre-patch": "tsx scripts/prePatchTypes.ts",
-    "build-types-roll": "tsx scripts/api-extractor.ts run && rimraf temp",
+    "build-types-roll": "api-extractor run && rimraf temp",
     "build-types-post-patch": "tsx scripts/postPatchTypes.ts",
     "build-types-check": "tsx scripts/checkBuiltTypes.ts && tsc --project tsconfig.check.json",
     "typecheck": "tsc --noEmit",

packages/vite/scripts/api-extractor.ts

@@ -17,7 +17,9 @@ const distDir = resolve(dir, '../dist')
 const pkgJson = JSON.parse(
   readFileSync(resolve(dir, '../package.json'), 'utf-8'),
 )
-const deps = new Set(Object.keys(pkgJson.dependencies))
+const deps = new Set(
+  Object.keys(Object.assign(pkgJson.dependencies, pkgJson.peerDependencies)),
+)
 
 type SpecifierError = {
   loc: SourceLocation | null | undefined

packages/vite/scripts/checkBuiltTypes.ts

@@ -75,6 +75,7 @@ export type {
 export type {
   CSSOptions,
   CSSModulesOptions,
+  LightningCSSOptions,
   PreprocessCSSResult,
   ResolvedCSSOptions,
 } from './plugins/css'
@@ -144,4 +145,3 @@ export type { Terser } from 'dep-types/terser'
 export type { RollupCommonJSOptions } from 'dep-types/commonjs'
 export type { RollupDynamicImportVarsOptions } from 'dep-types/dynamicImportVars'
 export type { Matcher, AnymatchPattern, AnymatchFn } from 'dep-types/anymatch'
-export type { LightningCSSOptions } from 'dep-types/lightningcss'

packages/vite/src/node/index.ts

@@ -20,10 +20,10 @@ import type Sass from 'sass'
 import type Stylus from 'stylus'
 import type Less from 'less'
 import type { Alias } from 'dep-types/alias'
-import type { LightningCSSOptions } from 'dep-types/lightningcss'
 import type { TransformOptions } from 'esbuild'
 import { formatMessages, transform } from 'esbuild'
 import type { RawSourceMap } from '@ampproject/remapping'
+import type { BundleAsyncOptions, CustomAtRules } from 'lightningcss'
 import { getCodeWithSourcemap, injectSourcesContent } from '../server/sourcemap'
 import type { ModuleNode } from '../server/moduleGraph'
 import type { ResolveFn, ViteDevServer } from '../'
@@ -139,6 +139,12 @@ export type ResolvedCSSOptions = Omit<CSSOptions, 'lightningcss'> & {
   }
 }
 
+// remove options set by Vite
+export type LightningCSSOptions = Omit<
+  BundleAsyncOptions<CustomAtRules>,
+  'filename' | 'resolver' | 'minify' | 'sourceMap' | 'analyzeDependencies'
+>
+
 export function resolveCSSOptions(
   options: CSSOptions | undefined,
 ): ResolvedCSSOptions | undefined {
@@ -2167,13 +2173,15 @@ async function compileLightningCSS(
     ? (await importLightningCSS()).transformStyleAttribute({
         filename,
         code: Buffer.from(src),
-        targets: config.css?.lightningcss?.targets,
         minify: config.isProduction && !!config.build.cssMinify,
+        targets: config.css?.lightningcss?.targets,
         analyzeDependencies: true,
+        visitor: config.css?.lightningcss?.visitor,
       })
     : await (
         await importLightningCSS()
       ).bundleAsync({
+        ...config.css?.lightningcss,
         filename,
         resolver: {
           read(filePath) {
@@ -2204,14 +2212,12 @@ async function compileLightningCSS(
             return id
           },
         },
-        targets: config.css?.lightningcss?.targets,
         minify: config.isProduction && !!config.build.cssMinify,
         sourceMap: config.css?.devSourcemap,
         analyzeDependencies: true,
         cssModules: cssModuleRE.test(id)
           ? config.css?.lightningcss?.cssModules ?? true
           : undefined,
-        drafts: config.css?.lightningcss?.drafts,
       })
 
   let css = res.code.toString()