search

formkit / unplugin-formkit

Automatic FormKit configuration injection 🪄
https://formkit.com
MIT License
14 stars 2 forks source link

Setup is never called with Options API when using Nuxt #5

Open justin-schroeder opened 8 months ago

justin-schroeder commented 8 months ago

Moved here from formkit/formkit#1214

Reproduction

https://github.com/sebj54/nuxt-debug-formkit

Describe the bug

I noticed a strange bug when using Nuxt with Options API. When the FormKit component is in the template (commented or not), the setup function is never called.

I made a reproduction where you will find three components (each one is a page). These components should display a log in the console for each lifecycle event: setup, created (if using Options API) and mounted.

Components list:

  1. ko.vue: The component with the issue. You can try to uncomment the FormKit component but the setup function won't be called anyway. It is only called when you remove the comment/component.
  2. ok.vue: Same component than before but the difference is the component commented
  3. ok-composition.vue: Same component than ko.vue but Composition API is used here. There is also the FormKit component commented but the setup log is shown

Let me know if I can help in any way!

Environment

• OS: MacOS • Browser : Firefox • Version: 122

sebj54 commented 8 months ago

Hi Justin,

Thanks for your answer!

Hmm, I believe this is an issue with unplugin-formkit — as a workaround for now, you should be able to remove the autoImport from your nuxt.config.ts, but I’m guessing unplugin-formkit isn’t handling the options api properly.

You're right, it works if I disable autoimport. I then have to import FormKitSchema manually (only this component):

import { FormKitSchema } from '@formkit/vue'

export default {
    components: {
        FormKitSchema,
    },
}