実際に環境構築をしたPRはこちら Try Nuxt.js v2.0 and TS by yinm · Pull Request #1 · yinm/nuxtjs-sandbox

Nuxt.js v2.0での環境構築の方法などは、Nuxt.js v2.0.0がリリースされたので触ってみた【変更点まとめ】 - Studio Andyを参考にしました。

Nuxt.js + TypeScriptの環境構築は、Nuxt.js+ExpressのプロジェクトをTypeScript化する - Crieitを参考にしました。ただ、こちらの記事はNuxt.js1系になっているため、そのままでは動かないようでした。Nuxt.js v2.0がwebpack4に対応していることが原因なので、TypeScript moduleをNuxt Edge - Issue when running/building the project · Issue #48 · nuxt-community/typescript-templateの内容で書き直して、webpack4対応すると動きました。

ここまでで環境ができるはずです。

PRでは、ESLintを使ってTypeScriptのLintもしてみました。やり方はVue + TypeScriptなプロジェクトにESLintを導入する - Please Drive Fasterを参考にしました。

---

以下は、何をしてるんだろうな？と気になって調べたもののメモです。

vue-shims.d.tsのような型定義ファイルは、単一ファイルコンポーネント(*.vue)の場合にVueの型定義を自動でimportして、TypeScriptに型情報を伝える。ref: Single File Components - Microsoft/TypeScript-Vue-Starter

ts-loaderのappendTsSuffixToの設定は、単一ファイルコンポーネント(*.vue)内のTypeScriptコードを認識できるようにするために必要。ref: TypeStrong/ts-loader: TypeScript loader for webpack