Nuxt.jsプロジェクト作成手順

Nuxt.jsのプロジェクトを作る機会があったのでスニペットとして残しておく

$ npx create-nuxt-app nuxt-sample
$ cd nuxt-sample
$ npx -p npm-check-updates ncu -u
$ npm install
$ mkdir app
$ mv assets components layouts middleware pages plugins static store app

nuxt.config.jsを以下のように編集

export default {
  mode: 'spa',
+ srcDir: 'app/', //=> この行を追加
  /*
  ** Headers of the page
  */
  head: {
    title: process.env.npm_package_name || '',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: process.env.npm_package_description || '' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },
  // ... 略

$ npm run devを実行してブラウザでhttp://localhost:3000にアクセスして以下のような画面が出たら終了 Nuxt start