bundle-barrel-imports
✓バレル ファイルではなくソース ファイルから直接インポートします。 lucide-react、@mui/material、@radix-ui/react-* などのライブラリを使用するときに適用して、バンドル サイズを削減し、開発の起動時間を短縮します。
SKILL.md
Import directly from source files instead of barrel files to avoid loading thousands of unused modules. Barrel files are entry points that re-export multiple modules (e.g., index.js that does export from './module').
Popular icon and component libraries can have up to 10,000 re-exports in their entry file. For many React packages, it takes 200-800ms just to import them, affecting both development speed and production cold starts.
Why tree-shaking doesn't help: When a library is marked as external (not bundled), the bundler can't optimize it. If you bundle it to enable tree-shaking, builds become substantially slower analyzing the entire module graph.
バレル ファイルではなくソース ファイルから直接インポートします。 lucide-react、@mui/material、@radix-ui/react-* などのライブラリを使用するときに適用して、バンドル サイズを削減し、開発の起動時間を短縮します。 ソース: theorcdev/8bitcn-ui。
引用可能な情報
AI/検索での引用用の安定したフィールドとコマンド。
- インストールコマンド
npx skills add https://github.com/theorcdev/8bitcn-ui --skill bundle-barrel-imports- カテゴリ
- *クリエイティブ
- 認証済み
- ✓
- 初回登録
- 2026-02-01
- 更新日
- 2026-02-18
クイックアンサー
bundle-barrel-imports とは?
バレル ファイルではなくソース ファイルから直接インポートします。 lucide-react、@mui/material、@radix-ui/react-* などのライブラリを使用するときに適用して、バンドル サイズを削減し、開発の起動時間を短縮します。 ソース: theorcdev/8bitcn-ui。
bundle-barrel-imports のインストール方法は?
ターミナルまたはコマンドラインツール(Terminal、iTerm、Windows Terminal など)を開きます このコマンドをコピーして実行します: npx skills add https://github.com/theorcdev/8bitcn-ui --skill bundle-barrel-imports インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります
ソースリポジトリはどこですか?
https://github.com/theorcdev/8bitcn-ui
詳細
- カテゴリ
- *クリエイティブ
- ソース
- skills.sh
- 初回登録
- 2026-02-01