App pages

App pages are custom pages that plugins can add to the app, it can be use to add a configuration page or a page to handle a custom file type like .hph

To add a new app-page you need to use the addAppPage function from the plugin setup

Tip: you can use the resolve function to get a absolute path relative to the plugin folder location

.is/plugins/hello/index.js
export default {
    name: "Hello plugin",
    setup({ addAppPage, resolve }){
         addAppPage({
            name: 'hello-app-page',
            filename: resolve('hello-app-page.js')
        })
    }
}

Here is app page file, it is vuejs component in runtime format

.is/plugins/hello/hello-app-page.js
export default {
    props: {
        path: {
            type: String,
            required: true
        }
    },
    template: `
    <div class="flex h-full w-full items-center justify-center">
        <div class="flex flex-col text-center">          
            <div class="text-2xl font-bold mb-2">
                This is a page from hello plugin
            </div>
            
            <div>
                The path is: {{ path }}
            </div>        
        </div>
      
    </div>`
}

The route for the page will be: /app-page/hello-app-page

Now you can use this with a entry-middleware or with a button in the sidebar of a menu-item

Edit this page on GitHub