Lint
設定
プロジェクトで lintをするために ESLint を使用しているのであれば、TypeScript ファイルを ESLint で lint する方法は次のとおりです。
必要なことは、@nuxtjs/eslint-config-typescript
をインストールすることだけです:
すでに @nuxtjs/eslint-config
を使用している場合、Nuxt TypeScript ESLint に含まれているので依存関係から削除してください。
yarn add --dev @nuxtjs/eslint-config-typescript
npm i --save-dev @nuxtjs/eslint-config-typescript
そして、 ESLint設定ファイル .eslintrc.js
を作成または編集して @nuxtjs/eslint-config-typescript
を extends に入れます :
module.exports = {
extends: [
'@nuxtjs/eslint-config-typescript'
]
}
ESlint が TypeScript パーサー(@typescript-eslint/parser
)を使用するようにするために、parserOptions.parser
オプションが拡張した他の設定等によってオーバーライドされないことを確認してください。
パーサーとして babel-eslint
を使用していた場合は、.eslintrc.js
と依存関係から削除してください。
最後に、package.json
の lint
スクリプトを編集します。
"lint": "eslint --ext .ts,.js,.vue ."
これで npm run lint
(もしくは yarn lint
)を実行して TypeScript ファイルを lint できるようになりました。
TypeScript ESLint のルールを編集/上書きする必要がある場合は、こちらでサポートしているルールの一覧をみることができます。
ランタイム lint
ランタイム lint(ファイル保存後に ESLint を実行する)が必要な場合は、typeCheck
モジュールオプションを設定することで fork-ts-checker-webpack-plugin の eslint
機能を有効にすることができます。
export default {
typescript: {
typeCheck: {
eslint: {
files: './src/**/*.{ts,js,vue}'
}
}
}
}
ファイルを保存するたびに、コードの型チェックと lint の両方が行われます。