drunomics / nuxtjs-drupal-ce

A Nuxt module to easily connect Drupal via custom elements.
https://lupus-decoupled.org/
MIT License
22 stars 4 forks source link

[Vue warn]: Failed to resolve component: node #163

Closed StirStudios closed 12 months ago

StirStudios commented 12 months ago

I have setup a dev test to try out the latest version.

Nuxt Specs:

"nuxtjs-drupal-ce": "2.0.0-alpha11"
"nuxt": "^3.6.1"

Drupal Specs: Drupal: 9.5.9

Everything is set up locally. When I try to navigate to a node I get the following message:

[Vue warn]: Failed to resolve component: node                                                                                         6:27:11 PM
If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.

Within the [...slug] if I render page.content I see the data. So it seems like there is an issue with the component import from the module?

I am also using the playground setup.

Any help or insight would be great please.

fago commented 12 months ago

What's you Drupal setup, are you using lupus decoupled Drupal? Do you use markup or json rendering?

TurtlBbx commented 12 months ago

Latest version of nuxtjs-drupal-ce is 2.0.0-beta2. It would be best to use that.

Also make sure to use latest code from the default components (https://github.com/drunomics/nuxtjs-drupal-ce/tree/2.x/playground) in your project. We also have a scaffolding command in place for new projects: 3rd point in Setup instructions - https://github.com/drunomics/nuxtjs-drupal-ce#setup, which copies the default components from the installed nuxtjs-drupal-ce package playground to your Nuxt 3 project.

StirStudios commented 12 months ago

Thanks for all the guidance. We are using json rendering and we do have all Lupus Decoupled modules installed (latest dev version). @TurtlBbx thanks for the further guidance.

It looks like this was the issue: components: [{ path: '~/components', pathPrefix: false }]

Once I remove this it looks like all works well. We need to use this for our current project how can I make this work as needed with Lupus?

We are super excited and this will be a huge plus for the Drupal/Nuxt community.

TurtlBbx commented 12 months ago

@StirStudios Yes, the components rendered with Vue Render Function API, which we use for renderCustomElements helper which is used in e.g. <component :is="renderCustomElements(page.content)" /> must be globally registered to work (can be resolved).

TurtlBbx commented 12 months ago

I'll close this issue. It seems you've resolved the issue. If you have any further questions you can also write in Drupal Slack, lupus-decoupled channel.