Skip to content

Commit

Permalink
fix: improve deduplication support for svelte during dev (#137)
Browse files Browse the repository at this point in the history
* fix: improve deduplication support by adding svelte itself to optimizeDeps.include by default

* docs: improve changeset description
  • Loading branch information
dominikg committed Aug 10, 2021
1 parent 429708d commit e306c3d
Show file tree
Hide file tree
Showing 3 changed files with 46 additions and 9 deletions.
32 changes: 32 additions & 0 deletions .changeset/seven-cows-leave.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
---
'@sveltejs/vite-plugin-svelte': major
---

automatically include svelte in vite config optimizeDeps.include

Previously, svelte was automatically excluded. We include it now by default to improve deduplication.

As a result, svelte is pre-bundled by vite during dev, which it logs when starting the devserver

```shell
Pre-bundling dependencies:
svelte/animate
svelte/easing
svelte/internal
svelte/motion
svelte/store
(...and 2 more)
(this will be run only when your dependencies or config have changed)
```

And it's also visible in the browsers network tab, where requests for svelte imports now start with `node_modules/.vite/` during dev.

Check out the [vite pre-bundling documentation](https://vitejs.dev/guide/dep-pre-bundling.html) for more information.

To get the old behavior back, add the following to your vite config

```js
optimizeDeps: {
exclude: ['svelte'];
}
```
1 change: 1 addition & 0 deletions packages/vite-plugin-svelte/src/utils/constants.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ export const SVELTE_IMPORTS = [
'svelte/easing',
'svelte/internal',
'svelte/motion',
'svelte/ssr',
'svelte/store',
'svelte/transition',
'svelte'
Expand Down
22 changes: 13 additions & 9 deletions packages/vite-plugin-svelte/src/utils/options.ts
Original file line number Diff line number Diff line change
Expand Up @@ -179,20 +179,24 @@ export function buildExtraViteConfig(
options: ResolvedOptions,
config: UserConfig
): Partial<UserConfig> {
const allSvelteImports = [...SVELTE_IMPORTS, ...SVELTE_HMR_IMPORTS];

// exclude svelte imports from optimization unless explicitly included
const excludeFromOptimize = allSvelteImports.filter(
(x) => !config.optimizeDeps?.include?.includes(x)
);

// include svelte imports for optimization unless explicitly excluded
const include: string[] = [];
const exclude: string[] = ['svelte-hmr'];
const isSvelteExcluded = config.optimizeDeps?.exclude?.includes('svelte');
if (!isSvelteExcluded) {
log.debug(`adding bare svelte packages to optimizeDeps.include: ${SVELTE_IMPORTS.join(', ')} `);
include.push(...SVELTE_IMPORTS);
} else {
log.debug('"svelte" is excluded in optimizeDeps.exclude, skipped adding it to include.');
}
const extraViteConfig: Partial<UserConfig> = {
optimizeDeps: {
exclude: excludeFromOptimize
include,
exclude
},
resolve: {
mainFields: [...SVELTE_RESOLVE_MAIN_FIELDS],
dedupe: allSvelteImports
dedupe: [...SVELTE_IMPORTS, ...SVELTE_HMR_IMPORTS]
}
// this option is still awaiting a PR in vite to be supported
// see https://github.com/sveltejs/vite-plugin-svelte/issues/60
Expand Down

0 comments on commit e306c3d

Please sign in to comment.