StoryBookでAntデザインを使う

4026 ワード
テキストリンク

  • インストールプリセットライブラリ:npm i -D @storybook/preset-ant-design

  • antd変数を単独で変更しない場合は、addons配列に"@storybook/preset-ant-design"を追加するだけです.
    antd変数を変更した場合は、次のセクションを.storybook/main.jsファイルの添付ファイルに追加します.primary-color値には、プロジェクトで使用されるprimary color値が含まれます.
    • {
  name: '@storybook/preset-ant-design',
  options: {
    lessOptions: {
      modifyVars: {
        'primary-color': '#000',
      },
    },
  },
}
    次はmainjsファイルの例.
    module.exports = {
  "stories": [
    "../src/**/*.stories.mdx",
    "../src/**/*.stories.@(js|jsx|ts|tsx)"
  ],
  "addons": [
    "@storybook/addon-links",
    "@storybook/addon-essentials",
    {
      name: '@storybook/preset-ant-design',
      options: {
        lessOptions: {
          modifyVars: {
            'primary-color': '#fc1150',
          },
        },
      },
    },
  ],
  webpackFinal: async (config) => {
    ...
    return config;
  }
}
    Redisにはどのようなデータ構造がありますか?
    Redis Centinel--次元管理