druxt / druxt.js

The Fully Decoupled Drupal Framework
MIT License
112 stars 20 forks source link

Add support for Nuxt3 #337

Open Decipher opened 2 years ago

Decipher commented 2 years ago

Is your feature request related to a problem? Please describe. As a user I want to be use Druxt with Nuxt 3.

Describe the solution you'd like

Describe alternatives you've considered N/A

Additional context https://v3.nuxtjs.org/

Decipher commented 2 years ago

Initial test setting up a new Nuxt 3 install with the DruxtSite module didn't work.

Steps:

Errors include:

 ERROR  [unhandledRejection] Cannot read property 'hooks' of undefined                                                                                                                         22:28:54

  at Object.wrappedModule (node_modules/@nuxt/kit/dist/index.mjs:1092:13)
  at Object.installModule (node_modules/@nuxt/kit/dist/index.mjs:1196:17)
  at Object.DruxtSiteNuxtModule (node_modules/druxt-site/dist/druxt-site.ssr.js:50:8)
  at installModule (node_modules/@nuxt/kit/dist/index.mjs:1196:17)
  at initNuxt (node_modules/nuxt3/dist/index.mjs:817:11)
  at async load (node_modules/nuxi/dist/chunks/dev.mjs:6762:9)
  at async Object.invoke (node_modules/nuxi/dist/chunks/dev.mjs:6793:5)
  at async _main (node_modules/nuxi/dist/chunks/index.mjs:417:7)
WARN  [SSR] Error transforming /workspace/quickstart-druxt-site/nuxt/node_modules/druxt-site/dist/components/DruxtSite.vue: Error: Missing "./dist/components/DruxtModule.vue" export in "druxt" package
 WARN  [worker] Cannot find module '/workspace/quickstart-druxt-site/nuxt/node_modules/vue/server-renderer' imported from /workspace/quickstart-druxt-site/nuxt/.nuxt/nitro/index.mjs          22:40:07

  at finalizeResolution (internal/modules/esm/resolve.js:285:11)
  at moduleResolve (internal/modules/esm/resolve.js:708:10)
  at Loader.defaultResolve [as _resolve] (internal/modules/esm/resolve.js:819:11)
  at Loader.resolve (internal/modules/esm/loader.js:89:40)
  at Loader.getModuleJob (internal/modules/esm/loader.js:242:28)
  at ModuleWrap.<anonymous> (internal/modules/esm/module_job.js:73:40)
  at link (internal/modules/esm/module_job.js:72:36)
Decipher commented 2 years ago

It appears to work with @nuxt/bridge: https://v3.nuxtjs.org/getting-started/bridge

Branch: https://github.com/druxt/quickstart-druxt-site/tree/feature/nuxt-bridge Gitpod: https://gitpod.io#github.com/druxt/quickstart-druxt-site/tree/feature/nuxt-bridge

Decipher commented 2 years ago

npm run generate fails with DruxtSite on @nuxt/bridge:

 FATAL  [worker] Cannot use import statement outside a module                                                                                                                                  22:54:02

  import { DruxtClient } from 'druxt';
  ^^^^^^

  SyntaxError: Cannot use import statement outside a module
  at wrapSafe (internal/modules/cjs/loader.js:988:16)
  at Module._compile (internal/modules/cjs/loader.js:1036:27)
  at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10)
  at Module.load (internal/modules/cjs/loader.js:937:32)
  at Function.Module._load (internal/modules/cjs/loader.js:778:12)
  at ModuleWrap.<anonymous> (internal/modules/esm/translators.js:199:29)
  at ModuleJob.run (internal/modules/esm/module_job.js:170:25)
  at async Loader.import (internal/modules/esm/loader.js:178:24)
  at async Object.loadESM (internal/process/esm_loader.js:68:5)

   ╭────────────────────────────────────────────────────────────────────────╮
   │                                                                        │
   │   ✖ Nuxt Fatal Error                                                   │
   │                                                                        │
   │   SyntaxError: [worker] Cannot use import statement outside a module   │
   │                                                                        │
   ╰────────────────────────────────────────────────────────────────────────╯
Decipher commented 2 years ago

@christianwiedemann I came across your WIP branch today: https://github.com/christianwiedemann/druxt.js/tree/vue3

I have not yet had the opportunity to explore Nuxt3, but I would like to commence development on it once I have released Druxt 1.0.0.

However, if it is possible to get Vue 3 and Nuxt 3 support into Druxt without disrupting Vue 2 and Nuxt 2 support I would be willing to re-adjust the timeline.

Please do let me know if theres anything I can do to assist your development.

christianwiedemann commented 2 years ago

Hi @Decipher, we are currently trying to migrate only the "druxt" package to evaluate how much effort a migration would be. When we are ready, we will document the migration path here, and we can discuss the next steps. Currently, we are not sure if a side by side migration (vue2, vue3) is possible or either makes sense. But let discuss this later. What do you think? Thanks!

christianwiedemann commented 2 years ago

Hi @Decipher we decided to build our Component Library with vue-demi and skip the migration for now. Maybe vue-demi would also be a option for druxt.

Decipher commented 2 years ago

Hi @christianwiedemann,

Thanks for the update. I have not looked at vue-demi, but I will keep it in mind once I have the available bandwidth to give this issue.

Fingers crossed I have time to investigate further in the coming weeks.

Triloworld commented 2 years ago

Hi, Nuxt 3 is RC so status of this issue can be updated. https://nuxtjs.org/announcements/nuxt3-rc/

Decipher commented 2 years ago

Hi @Triloworld,

It's important that Druxt 1.0.0 is finalised before I personally can commit to Nuxt 3 / Vue 3.

It's definitely going to happen as a high priority after 1.0.0 though, and would appreciate any help in developing, documenting and testing.

z3cka commented 1 year ago

Nuxt 3 is here! https://nuxt.com/v3

tyler36 commented 1 year ago

Looking forward to testing an beta

gaetansenn commented 1 year ago

Do you know when the 2.0.0 is going to be developed ? Need some help @Decipher

Decipher commented 5 months ago

Hi @gaetansenn,

Sorry I missed your message. I am taking steps towards the 2.0.0 development, and would absolutely love any help anyone is willing to provide.

I will be prototyping over the next few weeks to give me a better idea of what is required and how long I expect the work to take, but my development resources are limited due to day job and life.