Skip to content

Commit

Permalink
Read svelte.config.js (#428)
Browse files Browse the repository at this point in the history
Partially reverts #382

The reason given there was that:
> which may not be what storybook users want / expect, since their production config may be different from the storybook config (same reason we don't automatically merge vite.config.js)

However, I think that users would expect their `svelte.config.js` to be taken into account. E.g. right now the user's preprocessing configuration is ignored. The user can still pass custom `svelteOptions` in `.storybook/main.cjs` if they need to override their normal options for some reason (although I can't think of a reason off the top of my head why this would be necessary)

You can see a number of people complaining preprocessing doesn't work here: storybookjs/addon-svelte-csf#4
  • Loading branch information
benmccann authored Jul 8, 2022
1 parent 47538af commit c055857
Show file tree
Hide file tree
Showing 4 changed files with 45 additions and 4 deletions.
1 change: 0 additions & 1 deletion examples/svelte/.storybook/main.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ export default withOverview(__dirname)({
},
// @ts-ignore
svelteOptions: {
preprocess: preprocess(),
// Possible with @sveltejs/vite-plugin-svelte version 1.0.0-next.43 or higher.
// Focus a story iframe and press cmd+shift (mac) or ctrl+shift (windows) to activate.
experimental: { inspector: true },
Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,7 @@
"typescript": "^4.5.4"
},
"dependencies": {
"@sveltejs/vite-plugin-svelte": "^1.0.0-next.49",
"bookcase-builder": "^0.0.8"
},
"bookcase-builder": {
Expand Down
7 changes: 4 additions & 3 deletions packages/builder-vite/vite-config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import * as path from 'path';
import fs from 'fs';
import { Plugin } from 'vite';
import { TypescriptConfig } from '@storybook/core-common';
import { loadSvelteConfig } from '@sveltejs/vite-plugin-svelte';
import viteReact from '@vitejs/plugin-react';

import { allowedEnvPrefix as envPrefix } from './envs';
Expand Down Expand Up @@ -119,10 +120,9 @@ export async function pluginConfig(options: ExtendedOptions, _type: PluginConfig
// Non-story svelte files
// Starting in 1.0.0-next.42, svelte.config.js is included by default.
// We disable that, but allow it to be overridden in svelteOptions
plugins.push(sveltePlugin({ configFile: false, ...svelteOptions, exclude: [...userExclude, ...storyPatterns] }));
plugins.push(sveltePlugin({ ...svelteOptions, exclude: [...userExclude, ...storyPatterns] }));
// Svelte stories without HMR
const storySveltePlugin = sveltePlugin({
configFile: false,
...svelteOptions,
exclude: userExclude,
include: storyPatterns,
Expand All @@ -146,7 +146,8 @@ export async function pluginConfig(options: ExtendedOptions, _type: PluginConfig

try {
const csfPlugin = require('./svelte/csf-plugin').default;
plugins.push(csfPlugin(svelteOptions));
const config = loadSvelteConfig();
plugins.push(csfPlugin({ ...config, ...svelteOptions }));
} catch (err) {
// Not all projects use `.stories.svelte` for stories, and by default 6.5+ does not auto-install @storybook/addon-svelte-csf.
// If it's any other kind of error, re-throw.
Expand Down
40 changes: 40 additions & 0 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -4273,6 +4273,27 @@ __metadata:
languageName: node
linkType: hard

"@sveltejs/vite-plugin-svelte@npm:^1.0.0-next.49":
version: 1.0.0-next.49
resolution: "@sveltejs/vite-plugin-svelte@npm:1.0.0-next.49"
dependencies:
"@rollup/pluginutils": ^4.2.1
debug: ^4.3.4
deepmerge: ^4.2.2
kleur: ^4.1.4
magic-string: ^0.26.2
svelte-hmr: ^0.14.12
peerDependencies:
diff-match-patch: ^1.0.5
svelte: ^3.44.0
vite: ^2.9.0
peerDependenciesMeta:
diff-match-patch:
optional: true
checksum: d87d5a3762eb6bd3970b17d9405537b080a46a2301c487faf6efb776f6102fd1a030fd67d06e88a2cbabadc9162410467cc2dc52624a6edc9ed8cdefe60e635d
languageName: node
linkType: hard

"@tootallnate/once@npm:1":
version: 1.1.2
resolution: "@tootallnate/once@npm:1.1.2"
Expand Down Expand Up @@ -13843,6 +13864,15 @@ __metadata:
languageName: node
linkType: hard

"magic-string@npm:^0.26.2":
version: 0.26.2
resolution: "magic-string@npm:0.26.2"
dependencies:
sourcemap-codec: ^1.4.8
checksum: b4db4e2b370ac8d9ffc6443a2b591b75364bf1fc9121b5a4068d5b89804abff6709d1fa4a0e0c2d54f2e61e0e44db83efdfe219a5ab0ba6d25ee1f2b51fbed55
languageName: node
linkType: hard

"make-dir@npm:^2.0.0, make-dir@npm:^2.1.0":
version: 2.1.0
resolution: "make-dir@npm:2.1.0"
Expand Down Expand Up @@ -18475,6 +18505,7 @@ __metadata:
version: 0.0.0-use.local
resolution: "storybook-builder-vite-parent@workspace:."
dependencies:
"@sveltejs/vite-plugin-svelte": ^1.0.0-next.49
"@typescript-eslint/eslint-plugin": ^5.9.0
"@typescript-eslint/parser": ^5.9.0
bookcase-builder: ^0.0.8
Expand Down Expand Up @@ -18846,6 +18877,15 @@ __metadata:
languageName: node
linkType: hard

"svelte-hmr@npm:^0.14.12":
version: 0.14.12
resolution: "svelte-hmr@npm:0.14.12"
peerDependencies:
svelte: ">=3.19.0"
checksum: ac5f91030007c709e92992e9a06cda59304fe99c428d163aeff11c005b4bb293c504f1d1aa4a173cf27bbe38eaf7544956299074402efa1abb5ef61573b3f408
languageName: node
linkType: hard

"svelte-preprocess@npm:^4.10.4":
version: 4.10.6
resolution: "svelte-preprocess@npm:4.10.6"
Expand Down

0 comments on commit c055857

Please sign in to comment.