unplugin-formkit icon indicating copy to clipboard operation
unplugin-formkit copied to clipboard

Setup is never called with Options API when using Nuxt

Open justin-schroeder opened this issue 1 year ago • 1 comments

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

justin-schroeder avatar Mar 04 '24 18:03 justin-schroeder

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,
    },
}

sebj54 avatar Mar 05 '24 08:03 sebj54