Skip to content

Documentation Update - Include Non-SSR Setup Instructions - import.meta and official inertiaJS docs. #122

@TDodgeCo

Description

@TDodgeCo

There's no documentation on this repo for hooking up Vue3 without SSR. I followed the official documentation, which directed me to include this bit of code in my main javascript file (app.js in this case)

import { createApp, h } from 'vue'
import { createInertiaApp } from '@inertiajs/vue3'

createInertiaApp({
  resolve: name => {
    const pages = import.meta.glob('./Pages/**/*.vue', { eager: true })
    return pages[`./Pages/${name}.vue`]
  },
  setup({ el, App, props, plugin }) {
    createApp({ render: () => h(App, props) })
      .use(plugin)
      .mount(el)
  },
})

import.meta isn't a supported feature in the bundling processes included in AdonisJS. My templates wouldn't render until I changed

resolve: name => {
    const pages = import.meta.glob('./Pages/**/*.vue', { eager: true })
    return pages[`./Pages/${name}.vue`]

to:

resolve: (name) => require(./Pages/${name})

I found this extension through adocasts, and it was a little frustrating following their tutorial point for point and being unable to produce a working result. Naturally, I came to these docs first to see if there was any new steps in the process since his video is a year old. The import.meta issue appears to crop up fairly often, so it would likely save some folks a good deal of frustration mentioning how the AdonisJS inertia module expects things to be done.

Thanks!

Metadata

Metadata

Assignees

Labels

documentationImprovements or additions to documentation

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions