{"id":22711,"library":"vite-plugin-kit-routes","title":"vite-plugin-kit-routes","description":"vite-plugin-kit-routes is a Vite plugin for SvelteKit that generates a typed route helper file ($lib/ROUTES) from your file system routes. It provides autocompletion, type safety, and avoids typos by letting you reference routes via a type-safe route() function. The latest stable version is 1.0.3, released as part of the KitQL ecosystem. It requires SvelteKit ^2.4.0 and Vite ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0. Compared to manual route strings or other route generation tools, it integrates directly as a Vite plugin, generates TypeScript types automatically, and updates the route file on save. Release cadence follows monthly updates alongside other KitQL packages.","status":"active","version":"1.0.3","language":"javascript","source_language":"en","source_url":"https://github.com/jycouet/kitql","tags":["javascript","vite","vite-plugin","typescript"],"install":[{"cmd":"npm install vite-plugin-kit-routes","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-kit-routes","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-kit-routes","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency: required for SvelteKit route generation.","package":"@sveltejs/kit","optional":false},{"reason":"Peer dependency: required as a Vite plugin.","package":"vite","optional":false}],"imports":[{"note":"Named export since v1.0.0. Default import is not available.","wrong":"import kitRoutes from 'vite-plugin-kit-routes'","symbol":"kitRoutes","correct":"import { kitRoutes } from 'vite-plugin-kit-routes'"},{"note":"route() is generated in $lib/ROUTES by the plugin. Do not import from the package directly.","wrong":"import { route } from 'vite-plugin-kit-routes'","symbol":"route","correct":"import { route } from '$lib/ROUTES'"},{"note":"TypeScript type for route parameters, generated in $lib/ROUTES. Useful for parameterized routes.","wrong":"","symbol":"Routes","correct":"import type { Routes } from '$lib/ROUTES'"}],"quickstart":{"code":"// vite.config.(js|ts)\nimport { sveltekit } from '@sveltejs/kit/vite';\nimport { kitRoutes } from 'vite-plugin-kit-routes';\nimport { defineConfig } from 'vite';\n\nexport default defineConfig({\n  plugins: [\n    sveltekit(),\n    kitRoutes()\n  ]\n});\n\n// In a Svelte component or .ts file:\n<script lang=\"ts\">\n  import { route } from '$lib/ROUTES';\n  const url = route('/about'); // typed string\n</script>\n<a href={url}>About</a>","lang":"typescript","description":"Shows how to add the plugin to Vite config and use the generated route function in a SvelteKit component."},"warnings":[{"fix":"Ensure $lib/ROUTES exists after running the plugin. Import route from '$lib/ROUTES'.","message":"The route() function is generated in $lib/ROUTES, not imported from vite-plugin-kit-routes. If you try to import from the package, you will get a module not found error.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Update dependencies: npm install @sveltejs/kit@^2.4.0 vite@^5.0.0","message":"vite-plugin-kit-routes requires @sveltejs/kit ^2.4.0 and Vite ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0. Using older versions will cause compatibility issues.","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"Use named import: import { kitRoutes } from 'vite-plugin-kit-routes'","message":"Earlier versions (pre-1.0) used a different export pattern. Default import is now deprecated.","severity":"deprecated","affected_versions":"<1.0.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Ensure the plugin is properly added to vite.config and restart the dev server (npm run dev). The file is generated on startup.","cause":"The plugin has not generated the $lib/ROUTES file yet, or the file is out of sync.","error":"Error: Cannot find module '$lib/ROUTES' or its corresponding type declarations."},{"fix":"Use named import: import { kitRoutes } from 'vite-plugin-kit-routes'. Also check that the package is installed: npm i -D vite-plugin-kit-routes","cause":"Using a default import instead of a named import, or the package is not installed.","error":"[vite] Internal server error: [plugin:vite-plugin-kit-routes] kitRoutes is not a function"},{"fix":"Import route from '$lib/ROUTES' (not from the package). Ensure the plugin is running and the file exists.","cause":"Importing route from the wrong module or the generated file is missing.","error":"TypeError: route is not a function"},{"fix":"Upgrade @sveltejs/kit: npm install @sveltejs/kit@^2.4.0","cause":"Installed @sveltejs/kit version is too old.","error":"Error: [plugin:vite-plugin-kit-routes] Unsupported SvelteKit version. Requires @sveltejs/kit >=2.4.0"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}