NEXT.JS: Deployment build failed because of next lint

Question

Problem

I'm trying to deploy my git repository with vercel. But my deployments always fail because of lint errors in files I used for testing.

The Vercel docs say:

By default, Next.js will run ESLint for all files in the pages/, components/, lib/, and src/ directories. Vercel Docs Link

So I moved my _tests folder out of my components folder which helped for the local next linter running npm run lint now runs without any errors which should mirror the Vercel deployment built linter if I'm correct.

My lint settings are below:

{
  "extends": "next/core-web-vitals"
}

But when pushing to the main branch and deploying to vercel the linter still errors on files in the _test folder.

Folder structure

_tests // Here I moved my components and tests I don't want to have errors with as they're unfinished or only tests
.next
components
lib
node_modules
pages
....

Shouldn't the lint process local and on Vercel be the same and if not how can I test locally the same way as on my deployment build step? What am I missing? I've looked all over the docs regarding eslint.

Answer 1

First of all I would recommend you to not disregard lint issues even in your tests, because tests are part of your application. So the ideal world solution would be to fix all those lint issues and be happy.

But if you still want to exclude some code from being linted, you could use ESLint ignorePatterns . Configuration .eslintrc.json could look like:

{
    "extends": "next/core-web-vitals",
    "ignorePatterns": [
        "_test/**"
    ]
}

or you could write .eslintignore file with the following content:

_test/

Another possible solution for you could be to turn off Linter in next build command (by default Vercel uses this command for building your application). To do so, you need to add this to your next.config.js :

const nextConfig = {
    ...
    eslint: {
      ignoreDuringBuilds: false,
    },
};