Tiện ích mở rộng VSCode: Open Storybook – Chạy nhanh chỉ Storybook bạn muốn

Bối cảnh

Nhóm của chúng tôi gặp vấn đề về tốc độ khi chạy Storybook.
Khi dự án ngày càng lớn, thời gian build toàn bộ Storybook cũng dần dài hơn,
và dù chỉ muốn mở một phần story để kiểm thử, chúng tôi vẫn phải chạy toàn bộ Storybook mỗi lần hoặc bất tiện sửa đường dẫn trong .storybook/main.ts.

Để giải quyết vấn đề này, chúng tôi đã tạo tiện ích mở rộng VSCode có tên "Open Storybook".
Tương tự như Jest Runner, Storybook cũng có thể được "chạy bằng cách chỉ chọn một thư mục cụ thể trong File Explorer" hoặc "chạy bằng cách chọn file storybook mong muốn".

Tính năng

• Thư mục - nhấp chuột phải - lệnh Open Stories: có thể mở thêm tất cả Storybook trong thư mục đó.
• Command Palette: lệnh Open Storybook: nếu đã có Storybook được mở bằng lệnh, bạn có thể xem gộp Storybook hiện có + Storybook mới. (Nếu mở bằng Open Stories thì cũng được gộp tương tự.)
• Quản lý monorepo: quản lý riêng terminal Storybook theo từng package.
• Tìm và chạy lệnh storybook trong script; nếu không có thì chạy bằng npx storybook.

Cài đặt

• Tìm roseline-song.open-storybook hoặc open storybook trong phần extension
• Với Cursor: nếu gặp lỗi tương thích phiên bản VSCode, hãy nhấp nút bánh răng cạnh install - install specific version - cài bản mới nhất

[guseod24]

Phiên bản 0.0.5

Hiển thị toast lỗi khi cố mở bằng Open Storybook một tệp không phải Storybook
Khắc phục vấn đề đường dẫn Storybook theo từng package cứ liên tục bị cộng dồn
Khôi phục main.ts khi đóng terminal Storybook