Multiple root views

[bartdeman]

Hi, We would like to use two root views in a project, as we have 2 separate frontend applications that need a different set of assets. As far as I can see, we can configure only a single root_view. Is it possible to have multiple?

Thanks for your work on the bundle!

[rompetomp]

Hi

I'm not sure if I understand it correctly, but you could just, instead of using {{ inertia(page) }}, use the full <div id="app" data-page="<?php echo htmlspecialchars(json_encode($page)); ?>"></div>, and change the id for the other instance. Then in your frontend, you can mount both applications to their respective id:

const el = document.getElementById('app') // <-- Here

new Vue({
  render: h => h(App, {
    props: {
      initialPage: JSON.parse(el.dataset.page),
      resolveComponent: name => require(`./Pages/${name}`).default,
    },
  }),
}).$mount(el)

Do you think this could solve your issue?

[bartdeman]

Hi, Thanks for your answer! I'm not sure this would solve it. The 2 frontend applications are completely separate and live under a separate url, and each have their own set of javascript files and css files. I looked at the Laravel bundle and I see there is a setRootView method there (https://github.com/inertiajs/inertia-laravel/blob/master/src/Inertia.php), I was looking more for something like that.

[rompetomp]

I just released a new version that allows you to call $inertia->setRootView() in your controller. Does this solve your issue?

[bartdeman]

Great, this solves it indeed, thanks!