migratePostCSSJsonConfig() — tailwindcss Function Reference

Source Code

packages/@tailwindcss-upgrade/src/codemods/config/migrate-postcss.ts lines 214–290

async function migratePostCSSJsonConfig(json: any): Promise<{
  json: any
  didAddPostcssClient: boolean
  didRemoveAutoprefixer: boolean
  didRemovePostCSSImport: boolean
} | null> {
  function isTailwindCSSPlugin(plugin: string, options: any) {
    return plugin === 'tailwindcss' && isEmptyObject(options)
  }
  function isPostCSSImportPlugin(plugin: string, options: any) {
    return plugin === 'postcss-import' && isEmptyObject(options)
  }
  function isAutoprefixerPlugin(plugin: string, options: any) {
    return plugin === 'autoprefixer' && isEmptyObject(options)
  }
  function isTailwindCSSNestingPlugin(plugin: string, options: any) {
    return (
      plugin === 'tailwindcss/nesting' && (options === 'postcss-nesting' || isEmptyObject(options))
    )
  }

  let didAddPostcssClient = false
  let didRemoveAutoprefixer = false
  let didRemovePostCSSImport = false

  let plugins = Object.entries(json.plugins || {})

  let newPlugins: [string, any][] = []
  for (let i = 0; i < plugins.length; i++) {
    let [plugin, options] = plugins[i]

    if (isTailwindCSSPlugin(plugin, options)) {
      didAddPostcssClient = true
      newPlugins.push(['@tailwindcss/postcss', options])
    } else if (isAutoprefixerPlugin(plugin, options)) {
      didRemoveAutoprefixer = true
    } else if (isPostCSSImportPlugin(plugin, options)) {
      // Check that there are no unknown plugins before the tailwindcss plugin
      let hasUnknownPluginsBeforeTailwindCSS = false
      for (let j = i + 1; j < plugins.length; j++) {
        let [nextPlugin, nextOptions] = plugins[j]
        if (isTailwindCSSPlugin(nextPlugin, nextOptions)) {
          break
        }
        if (isTailwindCSSNestingPlugin(nextPlugin, nextOptions)) {
          continue
        }
        hasUnknownPluginsBeforeTailwindCSS = true
        break
      }

      if (!hasUnknownPluginsBeforeTailwindCSS) {
        didRemovePostCSSImport = true
      } else {
        newPlugins.push([plugin, options])
      }
    } else if (isTailwindCSSNestingPlugin(plugin, options)) {
      // Check if the following rule is the tailwindcss plugin
      let [nextPlugin, nextOptions] = plugins[i + 1]
      if (isTailwindCSSPlugin(nextPlugin, nextOptions)) {
        // Since this plugin is bundled with `tailwindcss`, we don't need to
        // clean up a package when deleting this line.
      } else {
        newPlugins.push([plugin, options])
      }
    } else {
      newPlugins.push([plugin, options])
    }
  }

  return {
    json: { ...json, plugins: Object.fromEntries(newPlugins) },
    didAddPostcssClient,
    didRemoveAutoprefixer,
    didRemovePostCSSImport,
  }
}