https://github.com/jeremy-code/eslint-config-next-flat

Intended as a stop-gap solution until Next.js updates their config to support Flat Config.
https://github.com/jeremy-code/eslint-config-next-flat

eslint eslint-config eslint-flat-config next nextjs

Last synced: about 1 month ago
JSON representation

Intended as a stop-gap solution until Next.js updates their config to support Flat Config.

• Host: GitHub
• URL: https://github.com/jeremy-code/eslint-config-next-flat
• Owner: jeremy-code
• License: mit
• Created: 2024-04-26T23:27:20.000Z (7 months ago)
• Default Branch: main
• Last Pushed: 2024-04-28T06:05:56.000Z (7 months ago)
• Last Synced: 2024-09-29T01:09:06.978Z (about 2 months ago)
• Topics: eslint, eslint-config, eslint-flat-config, next, nextjs
• Language: JavaScript
• Homepage:
• Size: 104 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# eslint-config-next-flat

[![GitHub Actions badge][github-actions-badge]][github-actions]

[![License][license-badge]](LICENSE)

[![License][npm-version-badge]][npm-package]

Flat config port of the Next.js ESLint config [`eslint-config-next`](https://www.npmjs.com/package/eslint-config-next).

## Installation

```bash

npm install -D eslint eslint-config-next-flat   # npm

yarn add -D eslint eslint-config-next-flat      # yarn

pnpm install -D eslint eslint-config-next-flat  # pnpm

```

Create an `eslint.config.js` file in the root of your Next.js project and add the following:

```js

const js = require("@eslint/js");

const next = require("eslint-config-next-flat");

/** @type {import('eslint').Linter.FlatConfig}[] */

module.exports = [

  { ignore: [".next"] }, // Change if `distDir` in Next.js config is different

  js.configs.recommended,

  next,

];

```

If not using TypeScript, add custom Next.js Babel parser from `"next/dist/compiled/babel/eslint-parser"`. Otherwise, for TypeScript, use [`typescript-eslint`](https://typescript-eslint.io/getting-started/).

```js

const js = require("@eslint/js");

const next = require("eslint-config-next-flat");

const parser = require("next/dist/compiled/babel/eslint-parser");

/** @type {import('eslint').Linter.FlatConfig}[] */

module.exports = [

  { ignore: [".next"] }, // Change if `distDir` in Next.js config is different

  js.configs.recommended,

  next,

  {

    files: ["**/*.js", "**/*.jsx"],

    languageOptions: {

      parser,

      parserOptions: {

        requireConfigFile: false,

        sourceType: "module",

        allowImportExportEverywhere: true,

        babelOptions: {

          presets: ["next/babel"],

          caller: {

            supportsTopLevelAwait: true,

          },

        },

      },

    },

  },

];

```

Depending on your project, you may need to adjust the `files` and `ignore` properties such as:

```js

const js = require("@eslint/js");

const next = require("eslint-config-next-flat");

module.exports = [

  { ignore: [".next"] }, // Change if `distDir` in Next.js config is different

  js.configs.recommended,

  {

    files: ["src", "pages", "components", "lib", "utils"], // Add your Next.js project directories

    ...next,

  },

];

```

## License

`next-config-next-flat` is licensed under the [MIT license](LICENSE).

[github-actions-badge]: https://github.com/jeremy-code/eslint-config-next-flat/actions/workflows/ci.yml/badge.svg

[github-actions]: https://github.com/jeremy-code/eslint-config-next-flat/actions/workflows/ci.yml

[license-badge]: https://img.shields.io/github/license/jeremy-code/eslint-config-next-flat

[npm-version-badge]: https://img.shields.io/npm/v/eslint-config-next-flat

[npm-package]: https://npmjs.com/package/eslint-config-next-flat