refactor: migrate eslint-plugin-next to typescript

packages/eslint-plugin-next/package.json

@@ -15,6 +15,7 @@
     "glob": "7.1.7"
   },
   "devDependencies": {
+    "@types/glob": "7.1.1",
     "eslint": "7.24.0"
   },
   "scripts": {

packages/eslint-plugin-next/src/rules/google-font-display.js → packages/eslint-plugin-next/src/rules/google-font-display.ts

@@ -1,8 +1,9 @@
-const NodeAttributes = require('../utils/node-attributes.js')
+import { defineRule } from '../utils/define-rule'
+import NodeAttributes from '../utils/node-attributes'
 
 const url = 'https://nextjs.org/docs/messages/google-font-display'
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description: 'Enforce font-display behavior with Google Fonts.',
@@ -12,10 +13,10 @@ module.exports = {
     type: 'problem',
     schema: [],
   },
-  create: function (context) {
+  create(context) {
     return {
       JSXOpeningElement(node) {
-        let message
+        let message: string | undefined
 
         if (node.name.name !== 'link') {
           return
@@ -58,4 +59,4 @@ module.exports = {
       },
     }
   },
-}
+})

packages/eslint-plugin-next/src/rules/google-font-preconnect.js → packages/eslint-plugin-next/src/rules/google-font-preconnect.ts

@@ -1,8 +1,9 @@
-const NodeAttributes = require('../utils/node-attributes.js')
+import { defineRule } from '../utils/define-rule'
+import NodeAttributes from '../utils/node-attributes'
 
 const url = 'https://nextjs.org/docs/messages/google-font-preconnect'
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description: 'Ensure `preconnect` is used with Google Fonts.',
@@ -12,7 +13,7 @@ module.exports = {
     type: 'problem',
     schema: [],
   },
-  create: function (context) {
+  create(context) {
     return {
       JSXOpeningElement(node) {
         if (node.name.name !== 'link') {
@@ -43,4 +44,4 @@ module.exports = {
       },
     }
   },
-}
+})

packages/eslint-plugin-next/src/rules/inline-script-id.js → packages/eslint-plugin-next/src/rules/inline-script-id.ts

@@ -1,6 +1,8 @@
+import { defineRule } from '../utils/define-rule'
+
 const url = 'https://nextjs.org/docs/messages/inline-script-id'
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description:
@@ -11,7 +13,7 @@ module.exports = {
     type: 'problem',
     schema: [],
   },
-  create: function (context) {
+  create(context) {
     let nextScriptImportName = null
 
     return {
@@ -70,4 +72,4 @@ module.exports = {
       },
     }
   },
-}
+})

packages/eslint-plugin-next/src/rules/next-script-for-ga.js → packages/eslint-plugin-next/src/rules/next-script-for-ga.ts

@@ -1,4 +1,5 @@
-const NodeAttributes = require('../utils/node-attributes.js')
+import { defineRule } from '../utils/define-rule'
+import NodeAttributes from '../utils/node-attributes'
 
 const SUPPORTED_SRCS = [
   'www.google-analytics.com/analytics.js',
@@ -18,7 +19,7 @@ const containsStr = (str, strList) => {
   return strList.some((s) => str.includes(s))
 }
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description,
@@ -28,7 +29,7 @@ module.exports = {
     type: 'problem',
     schema: [],
   },
-  create: function (context) {
+  create(context) {
     return {
       JSXOpeningElement(node) {
         if (node.name.name !== 'script') {
@@ -76,4 +77,4 @@ module.exports = {
       },
     }
   },
-}
+})

packages/eslint-plugin-next/src/rules/no-assign-module-variable.js → packages/eslint-plugin-next/src/rules/no-assign-module-variable.ts

@@ -1,6 +1,7 @@
+import { defineRule } from '../utils/define-rule'
 const url = 'https://nextjs.org/docs/messages/no-assign-module-variable'
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description: 'Prevent assignment to the `module` variable.',
@@ -11,13 +12,16 @@ module.exports = {
     schema: [],
   },
 
-  create: function (context) {
+  create(context) {
     return {
       VariableDeclaration(node) {
         // Checks node.declarations array for variable with id.name of `module`
-        const moduleVariableFound = node.declarations.some(
-          (declaration) => declaration.id.name === 'module'
-        )
+        const moduleVariableFound = node.declarations.some((declaration) => {
+          if ('name' in declaration.id) {
+            return declaration.id.name === 'module'
+          }
+          return false
+        })
 
         // Return early if no `module` variable is found
         if (!moduleVariableFound) {
@@ -31,4 +35,4 @@ module.exports = {
       },
     }
   },
-}
+})

packages/eslint-plugin-next/src/rules/no-before-interactive-script-outside-document.js → packages/eslint-plugin-next/src/rules/no-before-interactive-script-outside-document.ts

@@ -1,9 +1,10 @@
-const path = require('path')
+import { defineRule } from '../utils/define-rule'
+import * as path from 'path'
 
 const url =
   'https://nextjs.org/docs/messages/no-before-interactive-script-outside-document'
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description:
@@ -14,7 +15,7 @@ module.exports = {
     type: 'problem',
     schema: [],
   },
-  create: function (context) {
+  create(context) {
     let scriptImportName = null
 
     return {
@@ -56,4 +57,4 @@ module.exports = {
       },
     }
   },
-}
+})

packages/eslint-plugin-next/src/rules/no-css-tags.js → packages/eslint-plugin-next/src/rules/no-css-tags.ts

@@ -1,6 +1,7 @@
+import { defineRule } from '../utils/define-rule'
 const url = 'https://nextjs.org/docs/messages/no-css-tags'
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description: 'Prevent manual stylesheet tags.',
@@ -10,7 +11,7 @@ module.exports = {
     type: 'problem',
     schema: [],
   },
-  create: function (context) {
+  create(context) {
     return {
       JSXOpeningElement(node) {
         if (node.name.name !== 'link') {
@@ -43,4 +44,4 @@ module.exports = {
       },
     }
   },
-}
+})

packages/eslint-plugin-next/src/rules/no-document-import-in-page.js → packages/eslint-plugin-next/src/rules/no-document-import-in-page.ts

@@ -1,8 +1,9 @@
-const path = require('path')
+import { defineRule } from '../utils/define-rule'
+import * as path from 'path'
 
 const url = 'https://nextjs.org/docs/messages/no-document-import-in-page'
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description:
@@ -13,7 +14,7 @@ module.exports = {
     type: 'problem',
     schema: [],
   },
-  create: function (context) {
+  create(context) {
     return {
       ImportDeclaration(node) {
         if (node.source.value !== 'next/document') {
@@ -38,4 +39,4 @@ module.exports = {
       },
     }
   },
-}
+})

packages/eslint-plugin-next/src/rules/no-duplicate-head.js → packages/eslint-plugin-next/src/rules/no-duplicate-head.ts

@@ -1,6 +1,7 @@
+import { defineRule } from '../utils/define-rule'
 const url = 'https://nextjs.org/docs/messages/no-duplicate-head'
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description:
@@ -11,7 +12,7 @@ module.exports = {
     type: 'problem',
     schema: [],
   },
-  create: function (context) {
+  create(context) {
     let documentImportName
     return {
       ImportDeclaration(node) {
@@ -30,14 +31,21 @@ module.exports = {
           (ancestorNode) =>
             ancestorNode.type === 'ClassDeclaration' &&
             ancestorNode.superClass &&
+            'name' in ancestorNode.superClass &&
             ancestorNode.superClass.name === documentImportName
         )
 
         if (!documentClass) {
           return
         }
 
-        if (node.argument && node.argument.children) {
+        // @ts-expect-error - `node.argument` could be a `JSXElement` which has property `children`
+        if (
+          node.argument &&
+          'children' in node.argument &&
+          node.argument.children
+        ) {
+          // @ts-expect-error - `node.argument` could be a `JSXElement` which has property `children`
           const headComponents = node.argument.children.filter(
             (childrenNode) =>
               childrenNode.openingElement &&
@@ -57,4 +65,4 @@ module.exports = {
       },
     }
   },
-}
+})

packages/eslint-plugin-next/src/rules/no-head-element.js → packages/eslint-plugin-next/src/rules/no-head-element.ts

@@ -1,6 +1,8 @@
+import { defineRule } from '../utils/define-rule'
+
 const url = 'https://nextjs.org/docs/messages/no-head-element'
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description: 'Prevent usage of `<head>` element.',
@@ -11,7 +13,7 @@ module.exports = {
     type: 'problem',
     schema: [],
   },
-  create: function (context) {
+  create(context) {
     return {
       JSXOpeningElement(node) {
         const paths = context.getFilename()
@@ -29,4 +31,4 @@ module.exports = {
       },
     }
   },
-}
+})

packages/eslint-plugin-next/src/rules/no-head-import-in-document.js → packages/eslint-plugin-next/src/rules/no-head-import-in-document.ts

@@ -1,8 +1,9 @@
-const path = require('path')
+import { defineRule } from '../utils/define-rule'
+import * as path from 'path'
 
 const url = 'https://nextjs.org/docs/messages/no-head-import-in-document'
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description: 'Prevent usage of `next/head` in `pages/_document.js`.',
@@ -12,7 +13,7 @@ module.exports = {
     type: 'problem',
     schema: [],
   },
-  create: function (context) {
+  create(context) {
     return {
       ImportDeclaration(node) {
         if (node.source.value !== 'next/head') {
@@ -38,4 +39,4 @@ module.exports = {
       },
     }
   },
-}
+})

packages/eslint-plugin-next/src/rules/no-html-link-for-pages.js → packages/eslint-plugin-next/src/rules/no-html-link-for-pages.ts

@@ -1,12 +1,13 @@
-// @ts-check
-const path = require('path')
-const fs = require('fs')
-const getRootDir = require('../utils/get-root-dirs')
-const {
+import { defineRule } from '../utils/define-rule'
+import * as path from 'path'
+import * as fs from 'fs'
+import { getRootDirs } from '../utils/get-root-dirs'
+
+import {
   getUrlFromPagesDirectories,
   normalizeURL,
   execOnce,
-} = require('../utils/url')
+} from '../utils/url'
 
 const pagesDirWarning = execOnce((pagesDirs) => {
   console.warn(
@@ -21,7 +22,7 @@ const fsExistsSyncCache = {}
 
 const url = 'https://nextjs.org/docs/messages/no-html-link-for-pages'
 
-module.exports = {
+export = defineRule({
   meta: {
     docs: {
       description:
@@ -51,16 +52,12 @@ module.exports = {
 
   /**
    * Creates an ESLint rule listener.
-   *
-   * @param {import('eslint').Rule.RuleContext} context - ESLint rule context
-   * @returns {import('eslint').Rule.RuleListener} An ESLint rule listener
    */
-  create: function (context) {
-    /** @type {(string|string[])[]} */
-    const ruleOptions = context.options
+  create(context) {
+    const ruleOptions: (string | string[])[] = context.options
     const [customPagesDirectory] = ruleOptions
 
-    const rootDirs = getRootDir(context)
+    const rootDirs = getRootDirs(context)
 
     const pagesDirs = (
       customPagesDirectory
@@ -135,4 +132,4 @@ module.exports = {
       },
     }
   },
-}
+})