nuxtでページ遷移時にフェードイン・フェードアウト

• デフォルトでページ遷移のトランジションに page というトラジション名が付いているため、page トラジションに css を設定する。
  • https://ja.nuxtjs.org/api/configuration-transition/

.assets/css/main.css

.page-enter-active, .page-leave-active {
  transition: opacity 0.1s
}
.page-enter, .page-leave-active {
  opacity: 0
}

.nuxt.config.js

css: [
  '~/assets/css/main.css'
],