diff --git a/.changeset/lucky-ants-push.md b/.changeset/lucky-ants-push.md new file mode 100644 index 000000000..0bad84f47 --- /dev/null +++ b/.changeset/lucky-ants-push.md @@ -0,0 +1,5 @@ +--- +"@astrojs/svelte": patch +--- + +Improve README diff --git a/packages/integrations/svelte/README.md b/packages/integrations/svelte/README.md index 854bded21..f436ab2dd 100644 --- a/packages/integrations/svelte/README.md +++ b/packages/integrations/svelte/README.md @@ -74,11 +74,11 @@ This package is maintained by Astro's Core team. You're welcome to submit an iss ## Options -This integration is powered by `@sveltejs/vite-plugin-svelte`. To customize the Svelte compiler, options can be provided to the integration. See the `@sveltejs/vite-plugin-svelte` [docs](https://github.com/sveltejs/vite-plugin-svelte/blob/HEAD/docs/config.md) for more details. +This integration is powered by `@sveltejs/vite-plugin-svelte`. To customize the Svelte compiler, options can be provided to the integration. See the [`@sveltejs/vite-plugin-svelte` docs](https://github.com/sveltejs/vite-plugin-svelte/blob/HEAD/docs/config.md) for more details. ### Default options -A few of the default options passed to the Svelte compiler are required to build properly for Astro and cannot be overridden. +This integration passes the following default options to the Svelte compiler: ```js const defaultOptions = { @@ -88,12 +88,14 @@ const defaultOptions = { }; ``` -The `emitCss`, `compilerOptions.dev`, and `compilerOptions.hydratable` cannot be overridden. +These `emitCss`, `compilerOptions.dev`, and `compilerOptions.hydratable` values are required to build properly for Astro and cannot be overridden. -Providing your own `preprocess` options **will** override the defaults - make sure to enable the preprocessor flags needed for your project. For example, +Providing your own `preprocess` options **will** override the [`vitePreprocess()`](https://github.com/sveltejs/vite-plugin-svelte/blob/HEAD/docs/preprocess.md) default. Make sure to enable the preprocessor flags needed for your project. + +You can set options either by passing them to the `svelte` integration in `astro.config.mjs` or in `svelte.config.js`. Either of these would override the default `preprocess` setting: ```js -// astro.config.js +// astro.config.mjs import svelte from '@astrojs/svelte'; export default { @@ -101,8 +103,6 @@ export default { }; ``` -and - ```js // svelte.config.js export default { @@ -110,13 +110,12 @@ export default { }; ``` -Will override the default `preprocess` option. You can read the [`vitePreprocess` docs](https://github.com/sveltejs/vite-plugin-svelte/blob/HEAD/docs/preprocess.md) for more information of how it works. - ## Intellisense for TypeScript -If you're using a preprocessor like TypeScript or SCSS in your Svelte files, you can create a `svelte.config.js` file with: +If you're using a preprocessor like TypeScript or SCSS in your Svelte files, you can create a `svelte.config.js` file so that the Svelte IDE extension can correctly parse the Svelte files. ```js +// svelte.config.js import { vitePreprocess } from '@astrojs/svelte'; export default { @@ -124,4 +123,4 @@ export default { }; ``` -So the Svelte IDE extension can correctly parse the Svelte files. This config file is added by default when you run `astro add svelte`. +This config file will be automatically added for you when you run `astro add svelte`.