Provides comprehensive guidance for Bootstrap Vue 3 component library including Bootstrap components, grid system, utilities, and Vue 3 integration. Use when the user asks about Bootstrap Vue 3, needs to use Bootstrap components in Vue 3, or implement responsive layouts.
Use this skill whenever the user wants to:
This skill is organized to match the Bootstrap Vue 3.0 official documentation structure (https://bootstrap-vue.org/docs, https://bootstrap-vue.org/docs/components). When working with Bootstrap Vue 3.0:
Identify the topic from the user's request:
examples/getting-started/installation.md or examples/getting-started/basic-usage.mdexamples/components/button.mdexamples/components/form.mdexamples/components/table.mdexamples/components/modal.mdexamples/components/alert.mdexamples/components/navbar.mdexamples/components/grid.mdexamples/directives/tooltip.md or examples/directives/modal.mdLoad the appropriate example file from the examples/ directory:
Getting Started (快速开始) - examples/getting-started/:
examples/getting-started/installation.md - Installing Bootstrap Vue and basic setupexamples/getting-started/basic-usage.md - Basic component usageComponents (组件) - examples/components/:
examples/components/button.md - Button componentexamples/components/form.md - Form componentsexamples/components/input.md - Input componentexamples/components/table.md - Table componentexamples/components/modal.md - Modal componentexamples/components/alert.md - Alert componentexamples/components/navbar.md - Navbar componentexamples/components/grid.md - Grid system (Container, Row, Col)examples/components/card.md - Card componentexamples/components/badge.md - Badge componentexamples/components/dropdown.md - Dropdown componentexamples/components/pagination.md - Pagination componentexamples/components/tabs.md - Tabs componentexamples/components/collapse.md - Collapse componentexamples/components/popover.md - Popover componentexamples/components/tooltip.md - Tooltip componentDirectives (指令) - examples/directives/:
examples/directives/tooltip.md - v-b-tooltip directiveexamples/directives/popover.md - v-b-popover directiveexamples/directives/modal.md - v-b-modal directiveexamples/directives/toggle.md - v-b-toggle directiveAdvanced (高级) - examples/advanced/:
examples/advanced/theme-customization.md - Customizing Bootstrap themeexamples/advanced/composables.md - Using composables (useToast, useModal)Follow the specific instructions in that example file for syntax, structure, and best practices
Important Notes:
Reference API documentation in the api/ directory when needed:
api/components.md - Component API referenceapi/directives.md - Directives API referenceapi/composables.md - Composables API referenceUse templates from the templates/ directory:
templates/project-setup.md - Project setup templatestemplates/component-template.md - Component usage templatesGuide (指南):
examples/guide/ or examples/getting-started/ → https://bootstrap-vue.org/docsComponents (组件):
examples/components/ → https://bootstrap-vue.org/docs/componentsThis skill includes detailed examples organized to match the official documentation structure. All examples are in the examples/ directory (see mapping above).
To use examples:
To use templates:
templates/ directory for common scaffoldingDetailed API documentation is available in the api/ directory, organized to match the official Bootstrap Vue 3.0 API documentation structure:
api/components.md)api/directives.md)api/composables.md)To use API reference:
api/ directoryexamples/ directoryBootstrap Vue, Bootstrap Vue 3.0, Vue 3, Bootstrap 5, components, Button, Form, Table, Modal, Alert, Navbar, Grid, directives, v-b-tooltip, v-b-popover, v-b-modal, composables, useToast, useModal, 组件库, 按钮, 表单, 表格, 模态框, 警告框, 导航栏, 栅格, 指令
确保开发环境已安装必要的依赖和工具。
根据项目需求进行基础配置。
按照示例代码实现核心功能。
运行测试确保功能正常。
完成开发后进行部署和监控。