Site

Vue

v5

O mesmo protocolo do React: rota PHP, handler, inertia(), sessão e CSRF. Quem escreve Vue usa a pasta vue/ do tema. O tema default continua em React.

ℹ️Em poucas palavras

Um tema com só themes/{tema}/vue sobe em Vue. Um tema com só react/ sobe em React. As duas pastas juntas obedecem inertia.stack.


Pasta

themes/loja/vue/
├── app.css
├── layouts/Public.vue
└── pages/Home.vue

app/modules/shop/views/vue/show.vue
// config/system.php
'theme' => 'loja',

// config/inertia.php — só quando o tema tem react/ e vue/ juntos
'stack' => 'vue',

A entrada é app/engine/inertia/app.js. O cliente não copia essa entrada. Página do site: vue/pages/Home.vue, chamada com inertia('Home'). Página de plugin: app/modules/{plugin}/views/vue. O tema substitui o plugin em vue/modules/{plugin}/, sem a pasta views. Não há fallback para themes/default.

No tema ativo a pasta fica ao lado do React: themes/default/vue. Com as duas pastas, o build grava as duas e inertia.stack escolhe qual o HTML carrega.


Página

<script setup>
import { Link } from '@inertiajs/vue3'
</script>

<template>
    <div>
        <h1>{{ server.name }}</h1>
        <Link :href="route('home')">Início</Link>
        <img :src="src('platform/items/0-0.gif')" alt="" />
    </div>
</template>

route() já vem da Engine, no template e no script. Link sai de @inertiajs/vue3.src(), theme_src(), asset(), resource() e plugin_src() também estão no template, os mesmos helpers de Assets. Banner e logo continuam escolha do layout: theme_src('images/banner.jpg') ou uma URL escrita na página.

Páginas sem layout usam layouts/Public.vue. Para escolher outra casca, declare layout no componente.

<script>
import PublicLayout from '../layouts/Public.vue'

export default {
    layout: PublicLayout,
}
</script>

<script setup>
defineProps({
    server: Object,
})
</script>
⚠️Um tema, uma linguagem

React e Vue não dividem a mesma página. O handler segue devolvendo inertia('Home') ou view('home'). O admin permanece em .mucrm.php até ter a pasta React ou Vue dele.