createCSSResolvers() — vite Function Reference

Architecture documentation for the createCSSResolvers() function in css.ts from the vite codebase.

Function typescript PluginSystem LegacySupport calls 1 called by 1

Entity Profile

PluginSystem→ LegacySupport→ createCSSResolvers() — vite Function Reference

Dependency Diagram

graph TD
  08cb831c_da12_ecec_bc94_7f359d901588["createCSSResolvers()"]
  c3eb47df_971b_0616_6c9f_29b3ded72224["css.ts"]
  08cb831c_da12_ecec_bc94_7f359d901588 -->|defined in| c3eb47df_971b_0616_6c9f_29b3ded72224
  40ac1f90_7a40_f7a5_f25c_701a010aa803["getAtImportResolvers()"]
  40ac1f90_7a40_f7a5_f25c_701a010aa803 -->|calls| 08cb831c_da12_ecec_bc94_7f359d901588
  7ee86c21_2650_c869_2f5d_720909757e00["createBackCompatIdResolver()"]
  08cb831c_da12_ecec_bc94_7f359d901588 -->|calls| 7ee86c21_2650_c869_2f5d_720909757e00
  style 08cb831c_da12_ecec_bc94_7f359d901588 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/vite/src/node/plugins/css.ts lines 1282–1336

function createCSSResolvers(config: ResolvedConfig): CSSAtImportResolvers {
  let cssResolve: ResolveIdFn | undefined
  let sassResolve: ResolveIdFn | undefined
  let lessResolve: ResolveIdFn | undefined
  return {
    get css() {
      return (cssResolve ??= createBackCompatIdResolver(config, {
        extensions: ['.css'],
        mainFields: ['style'],
        conditions: ['style', DEV_PROD_CONDITION],
        tryIndex: false,
        preferRelative: true,
      }))
    },

    get sass() {
      if (!sassResolve) {
        const resolver = createBackCompatIdResolver(config, {
          extensions: ['.scss', '.sass', '.css'],
          mainFields: ['sass', 'style'],
          conditions: ['sass', 'style', DEV_PROD_CONDITION],
          tryIndex: true,
          tryPrefix: '_',
          preferRelative: true,
          skipMainField: true,
        })
        sassResolve = async (...args) => {
          // the modern API calls `canonicalize` with resolved file URLs
          // for relative URLs before raw specifiers
          if (args[1].startsWith('file://')) {
            args[1] = fileURLToPath(args[1], {
              windows:
                // file:///foo cannot be converted to path with windows mode
                isWindows && !fileURLWithWindowsDriveRE.test(args[1])
                  ? false
                  : undefined,
            })
          }
          return resolver(...args)
        }
      }
      return sassResolve
    },

    get less() {
      return (lessResolve ??= createBackCompatIdResolver(config, {
        extensions: ['.less', '.css'],
        mainFields: ['less', 'style'],
        conditions: ['less', 'style', DEV_PROD_CONDITION],
        tryIndex: false,
        preferRelative: true,
      }))
    },
  }
}