lukaskleinschmidt / kirby-laravel-vite

MIT License
14 stars 1 forks source link

Usage with Panel CSS config option #1

Closed tobimori closed 1 year ago

lukaskleinschmidt commented 1 year ago

It is possible. But right now you need to use the vite() helper in the ready callback has the Vite class requires a kirby instance to work properly. In addition to that kirby only allows relative asset paths here and skips URLs. So right now you need to use a little workaround to make it work.

This example does work but only once the assets are actually build. So no hot reloading for now:

<?php

return [
    'ready' => fn () => [
        'panel' => [
            'css' => parse_url(vite()->asset('assets/css/panel.css'), PHP_URL_PATH),
        ],
    ]
];

You also have to specify the panel styles in your vite config:

export default defineConfig({
  plugins: [
    laravel([
      'assets/css/app.css',
      'assets/css/panel.css',
      'assets/js/app.js',
  ],
});

That's how you can use it right now.

Good news :)

I actually have a solution to get everything working with hot reloading as well. Still just as a concept. But I might get a release out for this later today. Just need to tidy things up so everything is working as expected.

You would then be able to use it like this in your config:

<?php

return [
    'ready' => fn () => [
        'panel' => [
            'css' => vite('assets/css/panel.css'),
        ],
    ]
];
tobimori commented 1 year ago

Works great. I needed to add a substr() as it included a slash in the beginning which resulted in a double slash from Kirby - now if you have a solution for the dev client, that's where it gets interesting 👍

lukaskleinschmidt commented 1 year ago

Should work fine now with the latest release