fix(vite,webpack): handle local postcss plugins (#28481)

This commit is contained in:
Daniel Roe 2024-08-09 13:10:48 +01:00 committed by GitHub
parent 461498684a
commit 44e3d4e87f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 30 additions and 10 deletions

View File

@ -1,9 +1,10 @@
import { fileURLToPath, pathToFileURL } from 'node:url'
import { requireModule, tryResolveModule } from '@nuxt/kit'
import { requireModule, resolveAlias, tryResolveModule } from '@nuxt/kit'
import type { Nuxt, NuxtOptions } from '@nuxt/schema'
import type { InlineConfig as ViteConfig } from 'vite'
import { interopDefault } from 'mlly'
import type { Plugin } from 'postcss'
import { isAbsolute, resolve } from 'pathe'
function sortPlugins ({ plugins, order }: NuxtOptions['postcss']): string[] {
const names = Object.keys(plugins)
@ -26,16 +27,25 @@ export async function resolveCSSOptions (nuxt: Nuxt): Promise<ViteConfig['css']>
const pluginOptions = postcssOptions.plugins[pluginName]
if (!pluginOptions) { continue }
const path = await tryResolveModule(pluginName, nuxt.options.modulesDir)
let pluginPath: string | undefined = resolveAlias(pluginName, nuxt.options.alias)
let pluginFn: (opts: Record<string, any>) => Plugin
if (pluginPath[0] === '.') {
pluginPath = resolve(nuxt.options.rootDir, pluginPath)
}
const path = await tryResolveModule(pluginPath, nuxt.options.modulesDir)
// TODO: use jiti v2
if (path) {
pluginFn = await import(pathToFileURL(path).href).then(interopDefault)
} else {
console.warn(`[nuxt] could not import postcss plugin \`${pluginName}\` with ESM. Please report this as a bug.`)
// warn for libraries, not for local plugins
if (!isAbsolute(pluginPath)) {
console.warn(`[nuxt] could not import postcss plugin \`${pluginName}\` with ESM. Please report this as a bug.`)
}
// fall back to cjs
pluginFn = requireModule(pluginName, { paths: [cwd] })
pluginFn = requireModule(pluginPath, { paths: [cwd] })
}
if (typeof pluginFn === 'function') {
css.postcss.plugins.push(pluginFn(pluginOptions))

View File

@ -1,10 +1,11 @@
import { fileURLToPath, pathToFileURL } from 'node:url'
import createResolver from 'postcss-import-resolver'
import { interopDefault } from 'mlly'
import { requireModule, tryResolveModule } from '@nuxt/kit'
import { requireModule, resolveAlias, tryResolveModule } from '@nuxt/kit'
import type { Nuxt, NuxtOptions } from '@nuxt/schema'
import { defu } from 'defu'
import type { Plugin } from 'postcss'
import { isAbsolute, resolve } from 'pathe'
const isPureObject = (obj: unknown): obj is object => obj !== null && !Array.isArray(obj) && typeof obj === 'object'
@ -47,16 +48,25 @@ export async function getPostcssConfig (nuxt: Nuxt) {
const pluginOptions = postcssOptions.plugins[pluginName]
if (!pluginOptions) { continue }
const path = await tryResolveModule(pluginName, nuxt.options.modulesDir)
let pluginPath: string | undefined = resolveAlias(pluginName, nuxt.options.alias)
let pluginFn: (opts: Record<string, any>) => Plugin
if (pluginPath[0] === '.') {
pluginPath = resolve(nuxt.options.rootDir, pluginPath)
}
const path = await tryResolveModule(pluginPath, nuxt.options.modulesDir)
// TODO: use jiti v2
if (path) {
pluginFn = await import(pathToFileURL(path).href).then(interopDefault)
} else {
console.warn(`[nuxt] could not import postcss plugin \`${pluginName}\` with ESM. Please report this as a bug.`)
// warn for libraries, not for local plugins
if (!isAbsolute(pluginPath)) {
console.warn(`[nuxt] could not import postcss plugin \`${pluginName}\` with ESM. Please report this as a bug.`)
}
// fall back to cjs
pluginFn = requireModule(pluginName, { paths: [cwd] })
pluginFn = requireModule(pluginPath, { paths: [cwd] })
}
if (typeof pluginFn === 'function') {
plugins.push(pluginFn(pluginOptions))