Lint

Configuration

If you're using ESLint to lint your project, here is how you can make ESLint lint your TypeScript files.

All you need is to install @nuxtjs/eslint-config-typescript:

If you're already using @nuxtjs/eslint-config, remove it from your dependencies, the Nuxt TypeScript ESLint config includes it.

If you have not yet done so, you must install ESLint separately.

yarn add --dev @nuxtjs/eslint-config-typescript eslint

npm i --save-dev @nuxtjs/eslint-config-typescript eslint

Then, create or edit your ESLint configuration .eslintrc.js by extending @nuxtjs/eslint-config-typescript :

module.exports = {
  extends: [
    '@nuxtjs/eslint-config-typescript'
  ]
}

As it will make ESlint use a TypeScript parser (@typescript-eslint/parser), please ensure parserOptions.parser option is not overriden either by you or by another configuration you're extending.

If you were using babel-eslint as parser, just remove it from your .eslintrc.js and your dependencies.

Finally, edit the lint script of your package.json:

"lint": "eslint --ext .ts,.js,.vue ."

You can now lint your TypeScript files by running npm run lint (or yarn lint).

If you need to edit/override TypeScript ESLint rules, You can find here the list of all supported rules.

Runtime lint

If you want to have runtime lint (having ESLint running after a file has been saved), you can enable the eslint feature of fork-ts-checker-webpack-plugin by configuring the typeCheck module option

nuxt.config.js

export default {
  typescript: {
    typeCheck: {
      eslint: {
        files: './**/*.{ts,js,vue}'
      }
    }
  }
}

It will both type-check and lint your code whenever you're saving files.