reactjs - Storybook Typescript ei lataa juuri lisättyä props-tyyppiä, tarvitsee Storybookin uudelleenkäynnistyksen


module.exports = {
  stories: ["../**/*.stories.mdx", "../stories/**/*.stories.@(js|jsx|ts|tsx)"],
  addons: [
    "@storybook/addon-links",
    "@storybook/addon-essentials",
    "@storybook/addon-interactions",
    "@storybook/preset-create-react-app",
    "@storybook/addon-a11y"
  ],
  typescript: {
    reactDocgen: "react-docgen-typescript",
    reactDocgenTypescriptOptions: {
      shouldExtractLiteralValuesFromEnum: true,
      compilerOptions: {
        allowSyntheticDefaultImports: false,
        esModuleInterop: false
      }
    }
  },
  staticDirs: ["../src/assets"],
  framework: "@storybook/react",
  core: {
    builder: "@storybook/builder-webpack5"
  },
  webpackFinal: (config) => {
    config.module.rules.push({
      test: /\.tsx?$/,
      exclude: /node_modules/,
      use: [
        {
          loader: require.resolve("babel-loader"),
          options: {
            presets: [
              require("@babel/preset-typescript").default,
              [require("@babel/preset-react").default, { runtime: "automatic" }],
              // @ts-ignore
              require("@babel/preset-env").default
            ]
          }
        }
      ]
    });

    config.resolve.extensions.push(".ts", ".tsx");

    // config.module.rules.push({
    //   test: /\.mjs$/,
    //   include: /node_modules/,
    //   type: "javascript/auto"
    // });

    // config.resolve.extensions.push(".mjs");

    return config;
  }
};

Yllä on minun main.js-tiedostoni

export type ButtonProps= {
  width: string;
  /** Some comments */
  height: string;    // let say I added this after starting up Storybook
}

Kun lisään uusia props-arvoja props-tyyppiin (sanotaan vaikka height) nappityyppiini, Storybook ei ehkä näytä äskettäin lisättyjä props-arvoja tai kommentteja, ja uudet props-arvot tai kommentit näkyvät vain, jos käynnistän Storybookin uudelleen suorittamalla npm run storybook -skriptin. Kaikki (kuvaus, ominaisuudet) ladataan ja näkyvät vasta Storybookin uudelleenkäynnistyksen jälkeen.

Olen sisällyttänyt TypeScriptin konfiguraation main.js-tiedostooni alusta asti ja päätin hakea apua, koska ei ole tehokasta joutua käynnistämään Storybookia uudelleen, jos uudet muutokset eivät näy. Ilmoitathan, jos on jotain, mitä voisin kokeilla ratkaistakseni tämän ongelman.