How to override the $lib folder in SvelteKit

SvelteKit exposes $lib to eliminate the need of using '../../' while importing components into the routes.

$lib is by default pointing to:

src/lib

As per Svelte default boilerplate, it places the components under this location.

If you would like to place your components in a different directory say src/components, you can do an override in svelte.config.js as follows:

files: {
    // Override default lib folder
    lib: 'src/components'
}

Post this your overall config would look something as follows:

import adapter from '@sveltejs/adapter-auto';

/** @type {import('@sveltejs/kit').Config} */
const config = {
    kit: {
        adapter: adapter(),

        // Override http methods in the Todo forms
        methodOverride: {
            allowed: ['PATCH', 'DELETE']
        },
        files: {
            // Override default lib folder
            lib: 'src/components'
        }
    }
};

export default config;