メモ > 技術 > フレームワーク: Nuxt.js > 基本の手順でアプリを作成
■基本の手順でアプリを作成
C:\localhost\home\refirio_org\public_html\memos\nuxtjs\first\package.json
{
"name": "first-app",
"scripts": {
"dev": "nuxt"
}
}
以下のとおり実行
>cd C:\localhost\home\refirio_org\public_html\memos\nuxtjs\first
>npm install -save nuxt
>npm run dev
─────────────────────────────────────────────
│ │
│ Nuxt.js v2.12.2 │
│ Running in development mode (universal) │
│ │
│ Listening on: http://localhost:3000/ │
│ │
─────────────────────────────────────────────
i Preparing project for development 15:18:16
i Initial build may take a while 15:18:16
WARN No pages directory found in C:\localhost\home\refirio_org\public_html\memos\nuxtjs\first. Using the default built-in page.
√ Builder initialized 15:18:17
√ Nuxt files generated 15:18:17
√ Client
Compiled successfully in 7.99s
√ Server
Compiled successfully in 6.95s
i Waiting for file changes 15:18:26
i Memory usage: 192 MB (RSS: 252 MB) 15:18:26
i Listening on: http://localhost:3000/ 15:18:26
以下にアクセスすると「The Vue.js Framework」というデフォルトページが表示される
http://localhost:3000/
■ページの作成
以下にファイルを作成し、nuxt を停止させてから再度起動する
画面に作成ページの文言が表示される
C:\localhost\home\refirio_org\public_html\memos\nuxtjs\first\pages\index.vue
<template>
<div>
<h1>Hello!</h1>
<p>This is Next.js sample page.</p>
</div>
</template>