Nuxt.js3 pageに作成したindex.vueをapp.vueで使用する
- 作成日 2024.05.27
- nuxt.js

Nuxt.js3でpageに作成したindex.vueをapp.vueで使用する手順を記述しておきます。NuxtPagetaguタグを使用します。
環境
- OS ubuntu23.10
- node v20.13.1
- npm 10.8.0
- Nuxt.js v3.11.2
index.vue作成
まずは、以下のコマンドを実行するか直接作成するかして「pages」配下に「index.vue」を作成します。
$ npx nuxi add page index
「index.vue」が以下の内容で作成されます。
<script lang="ts" setup></script>
<template>
<div>
Page: index
</div>
</template>
<style scoped></style>
その後で「app.vue」に「NuxtPage」を追加します。
<template>
<div>
<h1>index.vueを表示</h1>
<NuxtPage />
</div>
</template>
これで、作成した「index.vue」が表示されるようになります。
実行結果

-
前の記事
MariaDB 処理時間の長いクエリの上位を抽出する 2024.05.27
-
次の記事
EXCEL 文字の位置を指定するショートカットキー 2024.05.27
コメントを書く