nuxtでのcss設計

componentに書かれたcssはグローバルにきく

componentに書いたcssはグローバルにきく。基本的にはcomponentに記述すればok。

components内に留めたいときはscoped

そのcomponentのみに効かせたい場合はscopedをつける

<style scoped>
</style>

1ファイルにまとめたいならnuxt.config.jsをいじる

componentsにcssを書いていけばいいが共通のものをどこか1ファイルに纏めたくなった場合はnuxt.config.jsに下記の記述。app.scssにまとめる。

module.export = {
  css:[
    "~/assets/scss/app.scss"
  ],
}