El proyecto Vue3+Vite presenta Bootstrap5 \bootstrap-icons
El tutorial oficial proporciona el uso de bootstrap5.2 y vite.
Instalar
Instale Bootstrap y Popper, porque los menús desplegables, los cuadros emergentes y la información sobre herramientas de Bootstrap dependen de Popper para el posicionamiento. Popper se puede omitir aquí si no planea usar estos componentes.
npm i --save bootstrap @popperjs/core
Instale dependencias adicionales en Sass para importar y agrupar correctamente el CSS de Bootstrap.
npm i --save-dev sass
Instalar biblioteca de iconos
npm i bootstrap-icons
Importar archivos de estilo de arranque
Cree un archivo style.scss en el directorio de activos
// Import all of Bootstrap's CSS
@import "bootstrap/scss/bootstrap";
// 图标
@import 'bootstrap-icons/font/bootstrap-icons.css';
Introduzca archivos de estilo y archivos JS en el archivo de entrada main.ts/main.js
import '/src/assets/styles.scss'
import "@popperjs/core";
import "bootstrap";
Al igual que otras bibliotecas de interfaz de usuario, se puede importar a pedido
import Alert from 'bootstrap/js/dist/alert';
import {
Tooltip, Toast, Popover } from 'bootstrap';
Esto está listo para usar. Si tiene alguna pregunta, puede ponerse en contacto conmigo en cualquier momento.
Escribir un artículo no es fácil, ¡dale un pulgar hacia arriba!
Escribir un artículo no es fácil, ¡dale un pulgar hacia arriba!
Escribir un artículo no es fácil, ¡dale un pulgar hacia arriba!
Escribir un artículo no es fácil, ¡dale un pulgar hacia arriba!
Escribir un artículo no es fácil, ¡dale un pulgar hacia arriba!
Escribir un artículo no es fácil, ¡dale un pulgar hacia arriba!