feat: flat config, eslint plugin, and nuxt module

.gitignore

@@ -1,13 +1,9 @@
-# Dependencies
 node_modules
-package-lock.json
-
-# Intellij idea
 *.iml
 .idea
-
 *.log
-
-# Yarn
+.nuxt
+.output
 **/.yarn/cache
 **/.yarn/*state*
+dist

.npmrc

@@ -0,0 +1,2 @@
+shamefully-hoist=true
+ignore-workspace-root-check=true

README.md

@@ -1,138 +1,21 @@
-# Nuxt ESLint packages
+![@nuxt/eslint](./.github/assets/social-card.png)
 
-## Nuxt 3: `@nuxt/eslint-config`
+# Nuxt ESLint
 
-[![npm version][npm-version-src]][npm-version-href]
-[![npm downloads][npm-downloads-src]][npm-downloads-href]
-<!--[![Github Actions][github-actions-src]][github-actions-href]
-[![Codecov][codecov-src]][codecov-href]
-[![Bundlephobia][bundlephobia-src]][bundlephobia-href]
-[![LGTM][lgtm-src]][lgtm-href]-->
+<p>
+  <a href="./LICENSE">
+    <img src="https://img.shields.io/github/license/nuxt/nuxt.svg?style=flat&colorA=18181B&colorB=28CF8D" alt="License">
+  </a>
+</p>
 
-> Non-opinionated [ESlint](https://eslint.org/) configuration for Nuxt 3 apps.
+Collection of [ESLint](https://eslint.org)-related packages for Nuxt ✨
 
-### Features
+## Packages
 
-- Works out-of-the-box with no additional configuration.
-- Nuxt-specific rules for pages, components and more.
-- ... under active development
-
-### Installation
-
-1. Install this package and `eslint` in your `devDependencies`.
-
-```bash
-npm i -D @nuxt/eslint-config eslint
-yarn add -D @nuxt/eslint-config eslint
-pnpm add -D @nuxt/eslint-config eslint
-```
-
-2. Extend the default Nuxt config by creating an `.eslintrc.cjs`:
-
-```js
-module.exports = {
-  root: true,
-  extends: ["@nuxt/eslint-config"],
-};
-```
-
-You might also want to add a script entry to your `package.json:
-
-```json
-{
-  "scripts": {
-    "lint": "eslint ."
-  }
-}
-```
-
-## Nuxt 2: `@nuxtjs/eslint-config` and `@nuxtjs/eslint-config-typescript`
-
-[![GitHub Actions](https://flat.badgen.net/github/checks/nuxt/eslint-config/main)](https://github.com/nuxt/eslint-config/actions?query=workflow%3Aci)
-[![npm](https://flat.badgen.net/npm/dm/@nuxtjs/eslint-config)](https://npmjs.com/package/@nuxtjs/eslint-config)
-[![npm (scoped with tag)](https://flat.badgen.net/npm/v/@nuxtjs/eslint-config)](https://npmjs.com/package/@nuxtjs/eslint-config)
-
-> Opinionated [ESlint](https://eslint.org/) configuration used internally by Nuxt projects.
-
-### Usage
-
-Do you want to add the config to your own projects? There you go:
-
-1. Add this package to your devDependencies
-
-```bash
-$ npm i -D @nuxtjs/eslint-config
-# or
-$ yarn add -D @nuxtjs/eslint-config
-```
-
-2. Install `eslint` if not already present locally or globally
-
-```bash
-$ npm i -D eslint
-# or
-$ yarn add -D eslint
-```
-
-3. Create a `.eslintrc` file
-
-4. Extend our config (you can use just the scope name as ESLint will assume the `eslint-config` prefix):
-
-```json
-{
-  "extends": ["@nuxtjs/eslint-config"]
-}
-```
-
-### Full example
-
-A full example `.eslintrc` for a project with babel support:
-
-> Dont forget to `npm i -D @babel/eslint-parser` or `yarn add -D @babel/eslint-parser`
-
-```json
-{
-  "root": true,
-  "parser": "@babel/eslint-parser",
-  "parserOptions": {
-    "sourceType": "module"
-  },
-  "extends": ["@nuxt/eslint-config"],
-}
-```
-
-### TypeScript
-
-If you're using TypeScript, follow [Usage](#usage) section by replacing `@nuxtjs/eslint-config` by `@nuxtjs/eslint-config-typescript`.
-
-And in your `.eslintrc` all you need is :
-
-```json
-{
-  "extends": ["@nuxtjs/eslint-config-typescript"]
-}
-```
-
-You can then edit/override same rules as you could with `@nuxtjs/eslint-config` but also TypeScript rules.
-You can find the list of supported TypeScript rules [here](https://typescript-eslint.io/rules/#supported-rules) and you can read more about Nuxt's TypeScript support [in the docs](https://nuxt.com/docs/guide/concepts/typescript).
+- [@nuxt/eslint](./packages/module) - Nuxt module generating project-aware ESLint config
+- [@nuxt/eslint-config](./packages/eslint-config) - Static ESLint Config
+- [@nuxt/eslint-plugin](./packages/eslint-plugin) - ESLint Plugin
 
 ## License
 
-Made with ❤️
-
-Published under [MIT License](./LICENCE).
-
-<!-- Badges -->
-
-[npm-version-src]: https://img.shields.io/npm/v/@nuxt/eslint-config?style=flat-square
-[npm-version-href]: https://npmjs.com/package/@nuxt/eslint-config
-[npm-downloads-src]: https://img.shields.io/npm/dm/@nuxt/eslint-config?style=flat-square
-[npm-downloads-href]: https://npmjs.com/package/@nuxt/eslint-config
-[github-actions-src]: https://img.shields.io/github/workflow/status/nuxt/eslint-config/ci/main?style=flat-square
-[github-actions-href]: https://github.com/nuxt/eslint-config/actions?query=workflow%3Aci
-[codecov-src]: https://img.shields.io/codecov/c/gh/nuxt/eslint-config/main?style=flat-square
-[codecov-href]: https://codecov.io/gh/nuxt/eslint-config
-[lgtm-src]: https://img.shields.io/lgtm/grade/javascript/github/nuxt/eslint-config?style=flat-square
-[lgtm-href]: https://lgtm.com/projects/g/nuxt/eslint-config
-[bundlephobia-src]: https://img.shields.io/bundlephobia/minzip/@nuxt/eslint-config?style=flat-square
-[bundlephobia-href]: https://bundlephobia.com/package/@nuxt/eslint-config
+[MIT License](./LICENSE)

eslint.config.js

@@ -0,0 +1,6 @@
+// @ts-check
+import { createNuxtESLintFlatConfig } from '@nuxt/eslint-config/flat'
+
+export default [
+  ...createNuxtESLintFlatConfig()
+]

package.json

@@ -1,17 +1,26 @@
 {
   "private": true,
-  "workspaces": [
-    "packages/*"
-  ],
+  "packageManager": "[email protected]",
+  "version": "0.3.0-alpha.0",
   "scripts": {
-    "lint": "eslint . --config=packages/eslint-config/index.js",
+    "build": "pnpm run -r build",
+    "stub": "pnpm run -r stub",
     "release": "pnpm test && pnpm publish -r",
-    "test": "pnpm lint && vitest run"
+    "test": "vitest run",
+    "play": "pnpm -C playground run play:dev",
+    "lint": "eslint . --config=packages/eslint-config/index.js",
+    "lint:play": "pnpm -C playground run lint",
+    "typecheck": "tsc --noEmit"
   },
   "devDependencies": {
-    "eslint": "^8.56.0",
-    "vitest": "^1.1.0",
-    "vue": "^3.3.13"
-  },
-  "packageManager": "[email protected]"
+    "@nuxt/test-utils": "^3.11.0",
+    "@nuxt/eslint-config": "workspace:*",
+    "@nuxt/eslint-plugin": "workspace:*",
+    "@types/eslint": "^8.56.5",
+    "@types/node": "^20.11.25",
+    "eslint": "^8.57.0",
+    "typescript": "^5.4.2",
+    "vitest": "^1.3.1",
+    "vue": "^3.4.21"
+  }
 }

packages/eslint-config/README.md

@@ -0,0 +1,55 @@
+# `@nuxt/eslint-config`
+
+[![npm version][npm-version-src]][npm-version-href]
+[![npm downloads][npm-downloads-src]][npm-downloads-href]
+
+> Non-opinionated [ESlint](https://eslint.org/) configuration for Nuxt 3 apps.
+
+### Features
+
+- Works out-of-the-box with no additional configuration.
+- Nuxt-specific rules for pages, components and more.
+
+### Installation
+
+1. Install this package and `eslint` in your `devDependencies`.
+
+```bash
+npm i -D @nuxt/eslint-config eslint
+yarn add -D @nuxt/eslint-config eslint
+pnpm add -D @nuxt/eslint-config eslint
+```
+
+2. Extend the default Nuxt config by creating an `.eslintrc.cjs`:
+
+```js
+module.exports = {
+  root: true,
+  extends: ["@nuxt/eslint-config"],
+};
+```
+
+You might also want to add a script entry to your `package.json:
+
+```json
+{
+  "scripts": {
+    "lint": "eslint ."
+  }
+}
+```
+
+<!-- Badges -->
+
+[npm-version-src]: https://img.shields.io/npm/v/@nuxt/eslint-config?style=flat-square
+[npm-version-href]: https://npmjs.com/package/@nuxt/eslint-config
+[npm-downloads-src]: https://img.shields.io/npm/dm/@nuxt/eslint-config?style=flat-square
+[npm-downloads-href]: https://npmjs.com/package/@nuxt/eslint-config
+[github-actions-src]: https://img.shields.io/github/workflow/status/nuxt/eslint-config/ci/main?style=flat-square
+[github-actions-href]: https://github.com/nuxt/eslint-config/actions?query=workflow%3Aci
+[codecov-src]: https://img.shields.io/codecov/c/gh/nuxt/eslint-config/main?style=flat-square
+[codecov-href]: https://codecov.io/gh/nuxt/eslint-config
+[lgtm-src]: https://img.shields.io/lgtm/grade/javascript/github/nuxt/eslint-config?style=flat-square
+[lgtm-href]: https://lgtm.com/projects/g/nuxt/eslint-config
+[bundlephobia-src]: https://img.shields.io/bundlephobia/minzip/@nuxt/eslint-config?style=flat-square
+[bundlephobia-href]: https://bundlephobia.com/package/@nuxt/eslint-config

packages/eslint-config/build.config.ts

@@ -0,0 +1,12 @@
+import { defineBuildConfig } from 'unbuild'
+
+export default defineBuildConfig({
+  entries: [
+    'src/legacy.ts',
+    'src/flat.ts',
+  ],
+  declaration: true,
+  rollup: {
+    emitCJS: true,
+  },
+})

packages/eslint-config/package.json

@@ -4,25 +4,41 @@
   "description": "ESLint config for Nuxt projects",
   "repository": "nuxt/eslint-config",
   "license": "MIT",
-  "main": "index.js",
+  "main": "./dist/legacy.cjs",
   "exports": {
-    ".": "./index.js"
+    ".": {
+      "import": "./dist/legacy.mjs",
+      "require": "./dist/legacy.cjs"
+    },
+    "./flat": {
+      "import": "./dist/flat.mjs",
+      "require": "./dist/flat.cjs"
+    }
   },
   "files": [
-    "index.js"
+    "dist"
   ],
-  "dependencies": {
-    "@rushstack/eslint-patch": "^1.6.1",
-    "@typescript-eslint/eslint-plugin": "^6.15.0",
-    "@typescript-eslint/parser": "^6.15.0",
-    "eslint-plugin-vue": "^9.19.2",
-    "typescript": "^5.3.3"
-  },
-  "devDependencies": {
-    "@types/eslint": "^8.56.0",
-    "eslint": "^8.56.0"
+  "scripts": {
+    "build": "unbuild",
+    "stub": "unbuild --stub",
+    "prepack": "npm run build"
   },
   "peerDependencies": {
     "eslint": "^8.56.0"
+  },
+  "dependencies": {
+    "@eslint/js": "^8.57.0",
+    "@nuxt/eslint-plugin": "workspace:*",
+    "@rushstack/eslint-patch": "^1.7.2",
+    "@typescript-eslint/eslint-plugin": "^7.2.0",
+    "@typescript-eslint/parser": "^7.2.0",
+    "eslint-plugin-vue": "^9.22.0",
+    "pathe": "^1.1.2",
+    "vue-eslint-parser": "^9.4.2"
+  },
+  "devDependencies": {
+    "@types/eslint": "^8.56.5",
+    "eslint": "^8.57.0",
+    "typescript": "^5.4.2"
   }
 }

packages/eslint-config/src/flat.ts

@@ -0,0 +1 @@
+export * from './flat/index'

packages/eslint-config/src/flat/configs/disables.ts

@@ -0,0 +1,39 @@
+import { join, relative } from 'pathe'
+import { GLOB_EXTS } from '../constants'
+import type { FlatConfig, NuxtESLintConfigOptions } from '../types'
+
+export default function disables(options: NuxtESLintConfigOptions): FlatConfig[] {
+  const dirs = options.dirs ?? {}
+  const nestedGlobPattern = `**/*.${GLOB_EXTS}`
+
+  return [
+    {
+      name: 'nuxt:vue-routes-disables',
+      files: [
+        relative(dirs.src || '', `app.${GLOB_EXTS}`),
+        relative(dirs.src || '', `error.${GLOB_EXTS}`),
+
+        // Layouts and pages are not used directly by users so they can have one-word names.
+        ...(dirs.layouts?.map(layoutsDir => join(layoutsDir, nestedGlobPattern)) || []),
+        ...(dirs.pages?.map(pagesDir => join(pagesDir, nestedGlobPattern)) || []),
+
+        // These files should have multiple words in their names as they are within subdirectories.
+        ...(dirs.components?.map(componentsDir => join(componentsDir, nestedGlobPattern)) || []),
+      ],
+      rules: {
+        'vue/multi-word-component-names': 'off',
+      },
+    },
+    // Layouts and pages are required to have a single root element if transitions are enabled.
+    {
+      name: 'nuxt:vue-single-root',
+      files: [
+        ...(dirs.layouts?.map(layoutsDir => join(layoutsDir, nestedGlobPattern)) || []),
+        ...(dirs.pages?.map(pagesDir => join(pagesDir, nestedGlobPattern)) || []),
+      ],
+      rules: {
+        'vue/no-multiple-template-root': 'error',
+      },
+    },
+  ]
+}