Use "resolveConfig" as a config merge utility

[frederikhors]

From what I understand from reading the docs we can use import resolveConfig from 'tailwindcss/resolveConfig' to generate a fully merged version of our configuration.

I'm wondering if we can use it for merge too. Like this:

import { merge } from "lodash/merge"; // Here I wanna use import resolveConfig from 'tailwindcss/resolveConfig'

import thirdPartyConfig from "third/party/tailwind.config.js"

module.exports = merge( // Here I wanna use resolveConfig
  thirdPartyConfig,
  {
    theme: {
      // ...my own
    },
    variants: {
      // ...my own
    },
    future: {
      // ...my onw
    },
    experimental: {
      // ...my own
    }
  }
)

Is it possible?

[adamwathan]

Yep that will work! The order has to be reversed though, like:

resolveConfig(yourConfig, thirdPartyConfig, anotherThirdPartyConfig)

These will also be ultimately merged with the default config as well, which currently can't be avoided.

[heyalbert]

I'm having trouble to get this idea to work. Could you provide an example, please? That would be awesome.

This what I'm coming up so far:

import resolveConfig from 'tailwindcss/resolveConfig'
import tailwindConfig from './tailwind.config.js'
import thirdPartyConfig from "./thirdPartyConfig.js"
import anotherThirdPartyConfig from "./anotherThirdPartyConfig.js"
import { merge } from "lodash/merge";



module.exports = merge(
    resolveConfig(tailwindConfig, thirdPartyConfig, anotherThirdPartyConfig)
)

[adamwathan]

You don't need lodash at all 👍🏻

import resolveConfig from 'tailwindcss/resolveConfig'
import tailwindConfig from './tailwind.config.js'
import thirdPartyConfig from "./thirdPartyConfig.js"
import anotherThirdPartyConfig from "./anotherThirdPartyConfig.js"

module.exports = resolveConfig(tailwindConfig, thirdPartyConfig, anotherThirdPartyConfig)