I've built my first Electron-app with Svelte. After many trial-and-error-sessions and a lot of searching on google my app starts up and displays the index-page. The page work without any problems or errors in the console - except from the navigation.It's not a complex navigation, only two other pages.
So if I click on the site I want to navigate the screen turns white and in DevTools this error-message occurs:
Not allowed to load local resource: file:///A:/bilanz
This is the code in my +layout.svelte
:
<div class="ml-10 flex items-baseline space-x-4"><a href="/" class={`rounded-md px-3 py-2 text-sm font-medium text-gray-300 hover:bg-gray-700 hover:text-white ${page.url.pathname === '/' ? 'bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-white' : '' }` }>Rechnungen</a><a href="/bilanz" class={`rounded-md px-3 py-2 text-sm font-medium text-gray-300 hover:bg-gray-700 hover:text-white ${page.url.pathname === '/bilanz' ? 'bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-white' : '' }`}>Gesamtbilanz</a><a href="/admin" class={`rounded-md px-3 py-2 text-sm font-medium text-gray-300 hover:bg-gray-700 hover:text-white ${page.url.pathname === '/admin' ? 'bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-white' : '' }` }>Admin</a></div>
I think there is a problem on how I generate the electron-application but I don't know how to solve this.I added the parameters in the svelte.config.js
as mentioned on the official Svelte Docs:
import adapter from '@sveltejs/adapter-static';import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';/** @type {import('@sveltejs/kit').Config} */const config = {// Consult https://svelte.dev/docs/kit/integrations// for more information about preprocessorspreprocess: vitePreprocess(),kit: { // adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list. // If your environment is not supported, or you settled on a specific environment, switch out the adapter. // See https://svelte.dev/docs/kit/adapters for more information about adapters. adapter: adapter({ pages: 'build', assets: 'build', precompress: false, strict: true, })}};export default config;
I also added the +layout.js
under /src/routes
:
export const prerender = true;
Does anyone have an idea how to get the navigation work?