feat: support languages json/markdown

bin/create-config.js

@@ -36,7 +36,7 @@ if (sharedConfigIndex === -1) {
     // passed "--config"
     const packageName = argv[sharedConfigIndex + 1];
     const type = argv.includes("--eslintrc") ? "eslintrc" : "flat";
-    const answers = { config: { packageName, type } };
+    const answers = { config: { packageName, type }, languages: ["javascript"] };
     const generator = new ConfigGenerator({ cwd, packageJsonPath, answers });
 
     generator.calc();

lib/config-generator.js

@@ -10,6 +10,18 @@ import enquirer from "enquirer";
 import { isPackageTypeModule, installSyncSaveDev, fetchPeerDependencies, findPackageJson } from "./utils/npm-utils.js";
 import { getShorthandName } from "./utils/naming.js";
 import * as log from "./utils/logging.js";
+import { langQuestions, jsQuestions, mdQuestions, installationQuestions } from "./questions.js";
+
+const helperContent = `import path from "path";
+import { fileURLToPath } from "url";
+import { FlatCompat } from "@eslint/eslintrc";
+import pluginJs from "@eslint/js";
+
+// mimic CommonJS variables -- not needed if using CommonJS
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({baseDirectory: __dirname, recommendedConfig: pluginJs.configs.recommended});
+`;
 
 /**
  * Class representing a ConfigGenerator.
@@ -40,65 +52,15 @@ export class ConfigGenerator {
      * @returns {void}
      */
     async prompt() {
-        const questions = [
-            {
-                type: "select",
-                name: "purpose",
-                message: "How would you like to use ESLint?",
-                initial: 1,
-                choices: [
-                    { message: "To check syntax only", name: "syntax" },
-                    { message: "To check syntax and find problems", name: "problems" }
-                ]
-            },
-            {
-                type: "select",
-                name: "moduleType",
-                message: "What type of modules does your project use?",
-                initial: 0,
-                choices: [
-                    { message: "JavaScript modules (import/export)", name: "esm" },
-                    { message: "CommonJS (require/exports)", name: "commonjs" },
-                    { message: "None of these", name: "script" }
-                ]
-            },
-            {
-                type: "select",
-                name: "framework",
-                message: "Which framework does your project use?",
-                initial: 0,
-                choices: [
-                    { message: "React", name: "react" },
-                    { message: "Vue.js", name: "vue" },
-                    { message: "None of these", name: "none" }
-                ]
-            },
-            {
-                type: "select",
-                name: "language",
-                message: "Does your project use TypeScript?",
-                choices: [
-                    { message: "No", name: "javascript" },
-                    { message: "Yes", name: "typescript" }
-                ],
-                initial: 0
-            },
-            {
-                type: "multiselect",
-                name: "env",
-                message: "Where does your code run?",
-                hint: "(Press <space> to select, <a> to toggle all, <i> to invert selection)",
-                initial: 0,
-                choices: [
-                    { message: "Browser", name: "browser" },
-                    { message: "Node", name: "node" }
-                ]
-            }
-        ];
+        Object.assign(this.answers, await enquirer.prompt(langQuestions));
 
-        const answers = await enquirer.prompt(questions);
+        if (this.answers.languages.includes("javascript")) {
+            Object.assign(this.answers, await enquirer.prompt(jsQuestions));
+        }
 
-        Object.assign(this.answers, answers);
+        if (this.answers.languages.includes("md")) {
+            Object.assign(this.answers, await enquirer.prompt(mdQuestions));
+        }
     }
 
     /**
@@ -107,6 +69,7 @@ export class ConfigGenerator {
      */
     calc() {
         const isESMModule = isPackageTypeModule(this.packageJsonPath);
+        const useTs = this.answers.useTs;
 
         this.result.configFilename = isESMModule ? "eslint.config.js" : "eslint.config.mjs";
         this.answers.config = typeof this.answers.config === "string"
@@ -115,73 +78,116 @@ export class ConfigGenerator {
         const extensions = []; // file extensions to lint, the default is ["js", "mjs", "cjs"]
 
         let importContent = "";
-        const helperContent = `import path from "path";
-import { fileURLToPath } from "url";
-import { FlatCompat } from "@eslint/eslintrc";
-import pluginJs from "@eslint/js";
-
-// mimic CommonJS variables -- not needed if using CommonJS
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-const compat = new FlatCompat({baseDirectory: __dirname, recommendedConfig: pluginJs.configs.recommended});
-`;
         let exportContent = "";
         let needCompatHelper = false;
+        const languages = this.answers.languages ?? ["javascript"];
+        const purpose = this.answers.purpose;
 
-        if (this.answers.moduleType === "commonjs" || this.answers.moduleType === "script") {
-            exportContent += `  {files: ["**/*.js"], languageOptions: {sourceType: "${this.answers.moduleType}"}},\n`;
-        }
+        if (languages.includes("javascript")) {
+            if (this.answers.moduleType === "commonjs" || this.answers.moduleType === "script") {
+                exportContent += `  {files: ["**/*.js"], languageOptions: {sourceType: "${this.answers.moduleType}"}},\n`;
+            }
 
-        if (this.answers.env?.length > 0) {
-            this.result.devDependencies.push("globals");
-            importContent += "import globals from \"globals\";\n";
-            const envContent = {
-                browser: "globals: globals.browser",
-                node: "globals: globals.node",
-                "browser,node": "globals: {...globals.browser, ...globals.node}"
-            };
+            if (this.answers.env?.length > 0) {
+                this.result.devDependencies.push("globals");
+                importContent += "import globals from \"globals\";\n";
+                const envContent = {
+                    browser: "globals: globals.browser",
+                    node: "globals: globals.node",
+                    "browser,node": "globals: {...globals.browser, ...globals.node}"
+                };
 
-            exportContent += `  {languageOptions: { ${envContent[this.answers.env.join(",")]} }},\n`;
-        }
+                exportContent += `  {languageOptions: { ${envContent[this.answers.env.join(",")]} }},\n`;
+            }
+
+            if (purpose === "syntax") {
+
+                // no need to install any plugin
+            } else if (purpose === "problems") {
+                this.result.devDependencies.push("@eslint/js");
+                importContent += "import pluginJs from \"@eslint/js\";\n";
+                exportContent += "  pluginJs.configs.recommended,\n";
+            }
+
+            if (useTs) {
+                extensions.push("ts");
+                this.result.devDependencies.push("typescript-eslint");
+                importContent += "import tseslint from \"typescript-eslint\";\n";
+                exportContent += "  ...tseslint.configs.recommended,\n";
+            }
+
+            if (this.answers.framework === "vue") {
+                extensions.push("vue");
+                this.result.devDependencies.push("eslint-plugin-vue");
+                importContent += "import pluginVue from \"eslint-plugin-vue\";\n";
+                exportContent += "  ...pluginVue.configs[\"flat/essential\"],\n";
+
+                // https://eslint.vuejs.org/user-guide/#how-to-use-a-custom-parser
+                if (useTs) {
+                    exportContent += "  {files: [\"**/*.vue\"], languageOptions: {parserOptions: {parser: tseslint.parser}}},\n";
+                }
+            }
+
+            if (this.answers.framework === "react") {
+                extensions.push("jsx");
+
+                if (useTs) {
+                    extensions.push("tsx");
+                }
 
-        if (this.answers.purpose === "syntax") {
+                this.result.devDependencies.push("eslint-plugin-react");
+                importContent += "import pluginReact from \"eslint-plugin-react\";\n";
+                exportContent += "  pluginReact.configs.flat.recommended,\n";
+            }
+        } else {
+            exportContent += "  {ignores: [\"**/*.js\", \"**/*.cjs\", \"**/*.mjs\"]},\n";
+        }
 
-            // no need to install any plugin
-        } else if (this.answers.purpose === "problems") {
-            this.result.devDependencies.push("@eslint/js");
-            importContent += "import pluginJs from \"@eslint/js\";\n";
-            exportContent += "  pluginJs.configs.recommended,\n";
+        if (languages.some(item => item.startsWith("json"))) {
+            this.result.devDependencies.push("@eslint/json");
+            importContent += "import json from \"@eslint/json\";\n";
         }
+        if (languages.includes("json")) {
+            const config = purpose === "syntax"
+                ? "  {files: [\"**/*.json\"], plugins: {json}, language: \"json/json\"},\n"
+                : "  {files: [\"**/*.json\"], language: \"json/json\", ...json.configs.recommended},\n";
 
-        if (this.answers.language === "typescript") {
-            extensions.push("ts");
-            this.result.devDependencies.push("typescript-eslint");
-            importContent += "import tseslint from \"typescript-eslint\";\n";
-            exportContent += "  ...tseslint.configs.recommended,\n";
+            exportContent += config;
         }
+        if (languages.includes("jsonc")) {
+            const config = purpose === "syntax"
+                ? "  {files: [\"**/*.jsonc\"], plugins: {json}, language: \"json/jsonc\"},\n"
+                : "  {files: [\"**/*.jsonc\"], language: \"json/jsonc\", ...json.configs.recommended},\n";
 
-        if (this.answers.framework === "vue") {
-            extensions.push("vue");
-            this.result.devDependencies.push("eslint-plugin-vue");
-            importContent += "import pluginVue from \"eslint-plugin-vue\";\n";
-            exportContent += "  ...pluginVue.configs[\"flat/essential\"],\n";
+            exportContent += config;
+        }
+        if (languages.includes("json5")) {
+            const config = purpose === "syntax"
+                ? "  {files: [\"**/*.json5\"], plugins: {json}, language: \"json/json5\"},\n"
+                : "  {files: [\"**/*.json5\"], language: \"json/json5\", ...json.configs.recommended},\n";
 
-            // https://eslint.vuejs.org/user-guide/#how-to-use-a-custom-parser
-            if (this.answers.language === "typescript") {
-                exportContent += "  {files: [\"**/*.vue\"], languageOptions: {parserOptions: {parser: tseslint.parser}}},\n";
-            }
+            exportContent += config;
         }
 
-        if (this.answers.framework === "react") {
-            extensions.push("jsx");
+        if (languages.includes("md")) {
+            this.result.devDependencies.push("@eslint/markdown");
+            importContent += "import markdown from \"@eslint/markdown\";\n";
 
-            if (this.answers.language === "typescript") {
-                extensions.push("tsx");
-            }
+            if (purpose === "syntax") {
+                const config = this.answers.mdType === "commonmark"
+                    ? "  {files: [\"**/*.md\"], plugins: {markdown}, language: \"markdown/commonmark\"},\n"
+                    : "  {files: [\"**/*.md\"], plugins: {markdown}, language: \"markdown/gfm\"},\n";
+
+                exportContent += config;
+            } else if (purpose === "problems") {
+                exportContent += "  ...markdown.configs.recommended,\n";
+
+                if (this.answers.mdType === "gfm") {
 
-            this.result.devDependencies.push("eslint-plugin-react");
-            importContent += "import pluginReact from \"eslint-plugin-react\";\n";
-            exportContent += "  pluginReact.configs.flat.recommended,\n";
+                    // the default is commonmark
+                    exportContent += "  {files: [\"**/*.md\"], language: \"markdown/gfm\"},\n";
+                }
+            }
         }
 
         if (this.answers.config) {
@@ -243,24 +249,7 @@ export default [\n${exportContent}];`;
         log.info("The config that you've selected requires the following dependencies:\n");
         log.info(this.result.devDependencies.join(", "));
 
-        const questions = [{
-            type: "toggle",
-            name: "executeInstallation",
-            message: "Would you like to install them now?",
-            enabled: "Yes",
-            disabled: "No",
-            initial: 1
-        }, {
-            type: "select",
-            name: "packageManager",
-            message: "Which package manager do you want to use?",
-            initial: 0,
-            choices: ["npm", "yarn", "pnpm", "bun"],
-            skip() {
-                return this.state.answers.executeInstallation === false;
-            }
-        }];
-        const { executeInstallation, packageManager } = (await enquirer.prompt(questions));
+        const { executeInstallation, packageManager } = (await enquirer.prompt(installationQuestions));
         const configPath = path.join(this.cwd, this.result.configFilename);
 
         if (executeInstallation === true) {