Soy nuevo con Vue.js.

Tengo que implementar una pequeña aplicación web y aproveché la oportunidad para estudiar y familiarizarme con Vue.js.

Tengo una duda sobre los estilos.

En primer lugar, me gustaría usar SCSS y configuré mi proyecto de esta manera: creé algunos archivos scss sobre las reglas comunes (por ejemplo, botones, consultas de medios, etc.). Todos los archivos se incluyen en un solo archivo shared.scss

Para evitar incluirlo mucho tiempo, agregué esta configuración en el archivo vue.config

 module.exports = { css: { loaderOptions: { scss: { additionalData: `@import "@/assets/styles/_shared.scss";` } } } }

Para cada componente (como también para mi app.vue) tengo una etiqueta de estilo dedicada donde pongo las reglas scss relacionadas con el componente específico:

 <style lang="scss" scoped>

¿Es este un enfoque válido? ¿Podría ser mejor/posible incluir un archivo scss para cada componente? ¿Cuál es el enfoque que se utiliza para los proyectos de producción?