Convert build to Vite plugin and expose as @sveltejs/kit/experimental/vite

[benmccann]

Ref #4329

I didn't document it yet as it's still experimental. I'd also like to get feedback about using it with Vitest, Storybook, etc.

You should be able to use it with a vite.config.js that looks like:

import { sveltekit } from '@sveltejs/kit/experimental/vite';

export default {
  plugins: [ sveltekit() ]
};

For example, you can run the kit.svelte.dev site with the following vite.config.js after removing the vite config from svelte.config.js:

import * as path from 'path';
import { sveltekit } from '@sveltejs/kit/experimental/vite'
import { imagetools } from 'vite-imagetools';

export default {
	plugins: [ imagetools(), sveltekit() ],

	resolve: {
		alias: {
			$img: path.resolve('src/images')
		}
	},

	server: {
		fs: {
			strict: false
		}
	}
};

Some of this code may be able to be cleaned up when we drop support for vite config in svelte.config.js. We may also be able to cleanup some vite-plugin-svelte code if this proposal moves forward: vitejs/vite#8509

Update: this now supports preview as well (#5170) as dev and build

[changeset-bot]

🦋 Changeset detected

Latest commit: 4638cb2

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@sveltejs/kit	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[benmccann]

@nickbreaton @JessicaSachs FYI. I hope this might help you. I'd love some feedback if you're able to try it out at some point

[JessicaSachs]

!!! NICE. I'm looking forward to trying this out post-conferences... So.... mid-June? Unless @BlueWinds wants to give it a go first.

[bitdom8]

Can you share a svelte.config.file? @benmccann. My code is broken #5283

import adapter from '@sveltejs/adapter-node';
import preprocess from 'svelte-preprocess';
import path from 'path'


export default {
	kit: {
		  adapter: adapter({ }),
		  alias: {
			$i18n: path.resolve('./src/i18n'),
			// $lib: path.resolve('./src/lib'),
			$src: path.resolve('./src'),
			$locales: path.resolve('./locales'),
		},
	},
		preprocess : preprocess({
		preserve: ['ld+json'],
	  }),
  };