ppecheux
commented
1 year ago Hello, I am also looking for a solution to integrate storybook. For now, I just managed to launch storybook. I set up the .storybook/main.ts like that :
import type { StorybookConfig } from "storybook-solidjs-vite";
const config: StorybookConfig = {
stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
addons: [
"@storybook/addon-links",
"@storybook/addon-essentials",
"@storybook/addon-interactions",
],
framework: {
name: "storybook-solidjs-vite",
options: {},
},
docs: {
autodocs: "tag",
},
});
},
};
export default configthen I ran
pnpm run storybookbut got following error at build time
> storybook dev -p 6006
@storybook/cli v7.0.6
info => Starting manager..
ERR! TypeError: Cannot read properties of null (reading 'once')
ERR! at configureServer (file:///home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/solid-start@0.2.26_jjttyli7e42nw7nuih42omgpgm/node_modules/solid-start/vite/plugin.js:43:23)
ERR! at _createServer (file:///home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/vite@4.3.1_@types+node@18.15.13/node_modules/vite/dist/node/chunks/dep-24daf00c.js:63404:30)
ERR! at Module.start (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+builder-vite@7.0.6_mzhihm7zd2gyalpll4qoudvuha/node_modules/@storybook/builder-vite/dist/index.js:161:12571)
ERR! at async storybookDevServer (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+core-server@7.0.6/node_modules/@storybook/core-server/dist/index.js:35:7062)
ERR! at async buildDevStandalone (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+core-server@7.0.6/node_modules/@storybook/core-server/dist/index.js:48:2786)
ERR! at async withTelemetry (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+core-server@7.0.6/node_modules/@storybook/core-server/dist/index.js:35:3422)
ERR! at async dev (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+cli@7.0.6/node_modules/@storybook/cli/dist/generate.js:434:400)
ERR! at async Command.<anonymous> (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+cli@7.0.6/node_modules/@storybook/cli/dist/generate.js:436:225)
ERR! TypeError: Cannot read properties of null (reading 'once')
ERR! at configureServer (file:///home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/solid-start@0.2.26_jjttyli7e42nw7nuih42omgpgm/node_modules/solid-start/vite/plugin.js:43:23)
ERR! at _createServer (file:///home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/vite@4.3.1_@types+node@18.15.13/node_modules/vite/dist/node/chunks/dep-24daf00c.js:63404:30)
ERR! at Module.start (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+builder-vite@7.0.6_mzhihm7zd2gyalpll4qoudvuha/node_modules/@storybook/builder-vite/dist/index.js:161:12571)
ERR! at async storybookDevServer (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+core-server@7.0.6/node_modules/@storybook/core-server/dist/index.js:35:7062)
ERR! at async buildDevStandalone (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+core-server@7.0.6/node_modules/@storybook/core-server/dist/index.js:48:2786)
ERR! at async withTelemetry (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+core-server@7.0.6/node_modules/@storybook/core-server/dist/index.js:35:3422)
ERR! at async dev (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+cli@7.0.6/node_modules/@storybook/cli/dist/generate.js:434:400)
ERR! at async Command.<anonymous> (/home/pier/Documents/perso/skatelearning/poskills/jd-ssr/node_modules/.pnpm/@storybook+cli@7.0.6/node_modules/@storybook/cli/dist/generate.js:436:225)
WARN Broken build, fix the error above.
WARN You may need to refresh the browser.I fixed this by modifying node_modules/.pnpm/solid-start@0.2.26_jjttyli7e42nw7nuih42omgpgm/node_modules/solid-start/vite/plugin.js like that
function solidStartInlineServerModules(options) {
let lazy;
let config;
/** @type {import('vite').Plugin} */
return {
enforce: "pre",
configResolved(_config) {
lazy = _config.command !== "serve";
config = _config;
},
name: "solid-start-inline-server-modules",
configureServer(vite) {
if (vite.httpServer) { // <--- here
vite.httpServer.once("listening", async () => {
const label = ` > Server modules: `;
setTimeout(() => {
if (vite.resolvedUrls) {
const url = vite.resolvedUrls.local[0];
// eslint-disable-next-line no-console
console.log(`${label}\n ${c.magenta(`${url}_m/*`)}\n`);
}
}, 200);
});
}
}
};
}
// [...]
configureServer(vite) {
server = vite;
router.watch(console.log);
router.listener = listener;
if (vite.httpServer) { // <-- here
vite.httpServer.once("listening", async () => {
setTimeout(() => {
if (vite.resolvedUrls) {
const url = vite.resolvedUrls.local[0];
// eslint-disable-next-line no-console
printUrls(router, url.substring(0, url.length - 1));
}
}, 100);
});
}
},
// [...]
Let me know if there is a cleaner way
nksaraf
kkharji
ryansolid
Has anyone been able to run Storybook with Solid-Start? I've tried all the solutions provided here https://github.com/solidjs/solid-docs-next/issues/35, but none of them seem to work. These workouts are meant to be for solidjs, not solid-start