rspack-contrib / storybook-rsbuild

Storybook builder and frameworks powered by Rsbuild.
https://storybook.rsbuild.dev/
MIT License
83 stars 7 forks source link

Storybook fully recompiles on file change #149

Open kirillbashtenko opened 1 month ago

kirillbashtenko commented 1 month ago

Hi, not sure if it's exactly rsbuild issue, but for me when I save one file it recompiles all of them, considering 55 packages it's quite some time. I tried the Vite plugin for the storybook, and it only updates the affected file.

// main.ts
import { dirname, join } from "path";
const path = require("path");

module.exports = {
  transform: {
    "^.+\\.(t|j)sx?$": "@swc/jest",
  },
  stories: ["../packages/**/*.stories.@(js|jsx|ts|tsx)"],
  addons: [
   "@storybook/addon-actions",
    "@storybook/addon-a11y",
    "@storybook/addon-controls",
    "@storybook/addon-toolbars",
  ],
  framework:"storybook-react-rsbuild",
  rsbuildFinal: (config) => {
    config.output ??= {};
    config.output.assetPrefix = "/myproject/";
    return config;
  },
  typescript: {
    reactDocgen: false,
  },
};
// rsbuild.config.ts
import { defineConfig } from "@rsbuild/core";
import { pluginReact } from "@rsbuild/plugin-react";
import { pluginSvgr } from "@rsbuild/plugin-svgr";

export default defineConfig({
  plugins: [
    pluginReact(),
    pluginSvgr({
      svgrOptions: {
        exportType: "default",
        svgoConfig: {
          plugins: [
            {
              name: "preset-default",
              params: {
                overrides: {
                  removeViewBox: false,
                  inlineStyles: {
                    onlyMatchedOnce: false,
                  },
                  cleanupIds: false,
                },
              },
            },
          ],
        },
      },
    }),
  ],
});

Thank you!

fi3ework commented 1 month ago

Could you provide a minimal reproduction and the repeat path please? And how do you recognize that all the files are recompiled (under the hood, in Rspack architecture, you could say they're recompile and that is by design).

kirillbashtenko commented 1 month ago

@fi3ework So, I started digging with Rsdoctor, and my initial assumption was wrong. Sometimes, it just stuck for an unreasonable amount of time on several files.

image

Could it be connected to this one?

I am not sure about reproduction. I have cloned the storybook-rebuild repo, and with minimal examples, it works fine. Also, I use modern.js for medium-sized projects and don't have issues there, only with Storybook.

fi3ework commented 4 weeks ago

@kirillbashtenko Does this workaround also works for you https://github.com/web-infra-dev/rspack/issues/7490#issuecomment-2273955633?

kirillbashtenko commented 3 weeks ago

@fi3ework No, unfortunately, no. ( I've cloned both rspack and rsbuild and after changing the code and build linked to rsbuild and rsbuild to my project )

What else we can try or debug?

fi3ework commented 3 weeks ago

You could try to remove the following code I guess, I don't know what it does.

-  transform: {
-    "^.+\\.(t|j)sx?$": "@swc/jest",
-  },

And, TBH, I'm not sure what caused the issue, it's weird that takes swc-loader so much time. Could you provide a minimal reproduction if possible (It's okay if it's not small enough, as long as it can be reproduced)

kirillbashtenko commented 3 weeks ago

@fi3ework invited you in a repo ( made it private in case I missed something company-related, but it should generally be good).

fi3ework commented 3 weeks ago

I'll check it later today.

kirillbashtenko commented 2 weeks ago

@fi3ework any luck? is it reproducible for you?