Creé una aplicación sin cabeza con vue y ahora necesito cargar un archivo css exclusivamente para un componente específico.
En el código a continuación, inserté el archivo css, pero desafortunadamente se muestra globalmente en toda la aplicación.
<script> export default { name: "FriendComponent", ... } </script> <style> @import 'https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css'; </style>Para aplicar cualquier archivo o código CSS a un componente específico, debe agregar scoped en la etiqueta de style del componente.
Echa un vistazo a esto:
<style scoped> @import 'https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css'; </style>Esto aplicará CSS a este componente específico.