Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Improve Svelte README #5923

Merged
merged 4 commits into from
Jan 21, 2023
Merged

Improve Svelte README #5923

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
30f3577
First stylistic pass
delucis Jan 20, 2023
9d206ea
Rework for x/o instead of and
delucis Jan 21, 2023
77836f1
fix typo
delucis Jan 21, 2023
046006b
Add changeset
delucis Jan 21, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/lucky-ants-push.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@astrojs/svelte": patch
---

Improve README
21 changes: 10 additions & 11 deletions packages/integrations/svelte/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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 = {
Expand All @@ -88,40 +88,39 @@ 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 {
integrations: [svelte({ preprocess: [] })],
};
```

and

```js
// svelte.config.js
export default {
preprocess: [],
};
```

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 {
preprocess: vitePreprocess(),
};
```

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`.