ホームRailsの覚書Vue.jsの覚書MenuSidebarPrevNextSearchNuxt+Vuetifyでテンプレートを利用したスタートアップを行うはじめにjavascriptでフロントエンドを作るというと、最初が非常に面倒臭いイメージがございます。フォルダを掘って、ファイルを配置して、Webpackのコンフィグを書いて、といった必ず発生する諸作業です。これを一括して面倒を見てくれるのが、世の中に出回っているスタートアップ用のテンプレートでございます。Nuxtもまたnuxt-communityとvuetifyjsの協力から、便利なテンプレートが提供されております。実装インストール方法は以下の通りです。yarnのバージョンはプロジェクト毎に管理しておきたいので、インストールはglobalでなくlocalとします。同じディレクトリにvuetifyjs/nuxtのテンプレートを展開するよう、initに引数を渡します。devこれにより必要なパッケージのインストールも含めて、全てが完了です。最後のコマンドによってサーバーが立ち上がります。ブラウザでアクセスすると、以下のような形でVuetifyによって綺麗にデザインされたNuxtの画面を確認することができます。ちなみにリモート上で開発している場合は、外部からの参照を許可する為に、package.jsonに以下の通りポートとアクセスの許可を指定する必要があります。