Ladle lists stories but they're blank

Viewed 42

I have an app with some stories already, and I just installed Ladle alongside Storybook. I plan on running both Ladle and Storybook – Ladle for quick iteration in developing the UI and Storybook for interaction testing and other addons.

Running npx ladle serve opens up the browser, and all the stories are detected. However, the display window (main.ladle-main) is completely blank.

On the same branch, Storybook itself runs just fine. I ran the ladle server with debug, but I don't really know what to make of any of its output.

Most of my stories have play functions, I don't know if that's the issue.

I also copied my global decorator from my storybook preview file to .ladle/components.tsx

import type { GlobalProvider } from "@ladle/react";
import { AppWrapper } from "../src/AppWrapper";

export const Provider: GlobalProvider = ({ children, globalState }) => (
  <>
    <header>
      <link
        href="https://fonts.googleapis.com/css?family=Roboto:100,200,300,400,500,600,700"
        rel="stylesheet"
      />
      <link
        href="https://fonts.googleapis.com/css?family=Roboto+Condensed:400,500,600,700"
        rel="stylesheet"
      />
    </header>
    <AppWrapper>{children}</AppWrapper>
  </>
);
0 Answers
Related