Cant get styles to work at all

[LamprosPitsillos]

I am not opening an issue unless its a bug , this probably is user error.

I used the steps on the website after theme customization but my forms still have the default theme.

What could be the issue ?

[Eyesore123]

My guess is that your root classes aren't imported correctly. Check your imports and make sure your tailwind.config file is also correctly set up. Usually when styles don't load and there are no visible errors, it means that import fails for some reason. I'm not sure if the file type has anything to do with it, but the instructions use ts and you have mjs in your import so check that just in case. Mjs file type should be fine though since you're using ECMAscript modules in a node environment but check that as well. Also make sure that what you have in package.json reflects the file types you're using. I hope you can figure it out soon.

[LamprosPitsillos]

I'm not sure if the file type has anything to do with it, but the instructions use ts and you have mjs in your import so check that just in case. Mjs file type should be fine though since you're using ECMAscript modules in a node environment but check that as well. Also make sure that what you have in package.json reflects the file types you're using.

The .mjs format was the result of running the form kit command to generate a theme , my project does not actively use .mjs files.

// package.json
...
  "type": "module",
 ...

My guess is that your root classes aren't imported correctly. Check your imports and make sure your tailwind.config file is also correctly set up. Usually when styles don't load and there are no visible errors, it means that import fails for some reason.

Imports work fine as far as i can tell , my tailwind classes work , even the :root variables i have work too.

Sadly i don't see any other cause for this , the instructions are really simple too...

---

I haven't run the create-app helper though , cause i have an already existing project

npx formkit@latest create-app

the formkit config file and theme file is generated for me by the npx formkit@latest theme --*** arguments for theme gen ***

// formkit.config.mjs
import { defineFormKitConfig } from '@formkit/vue'
import { rootClasses } from './formkit.theme.mjs'

export default defineFormKitConfig({
  config: {
    rootClasses
  }
})

I have added the formkit.theme to the tailwind config file too
Also in my main.js i have the following as instructed

import config from 'formkit.config.mjs'

app.use(plugin, defaultConfig(config))

[LamprosPitsillos]

import { plugin, defaultConfig } from '@formkit/vue'
import config from '../formkit.config.mjs'
....
/** Loading Splash */
app.use(plugin, defaultConfig(config()));

What seemed to make it work was passing in the default config the config object and calling it