storybookで、bootstrapを使う

2022/01/30に公開約500字

概要:

storybookで、bootstrapの追加の例になります。今回はReact版です


構成

  • @storybook/react: 6.4.14
  • bootstrap 5
  • react 17
  • typescript

準備

  • preview-head.html追加、CDN読込

.storybook/preview-head.html

preview-head.html
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
  • 上記設定後、storybook再起動すると、bootstrap 適用できました。

  • bootstrap css適用後の、見た目


Discussion

ログインするとコメントできます