Hi,

I tried to post this in the weekly thread, but I get errors. (I assume it is due to comment length, but there is literally just an empty error)

EDIT: I have solved the issue and every time I try to post the solution (either by editing or adding a comment) I get that same empty error from reddit. for solution, see 2 comments below.

I have null-ls setup to run prettierd for html files. (that works like a charm)
Now I would like it to format html files with go templates and it does not seem pick up my prettierd config in the root of my project:

// <project_root>/.prettierrc
{
	"plugins": ["prettier-plugin-go-template"],
	"overrides": [
		{
			"files": ["*.html"],
			"options": {
				"parser": "go-template",
			},
		},
	],
}  

NullLsInfo shows prettierd is active, but not the supported list is empty.
How do I make sure that the .prettierrc is used?
I used lazy.nvim to setup null-ls see setup below.

Any help would be appreciated

return {
	"jose-elias-alvarez/null-ls.nvim", -- configure formatters & linters
	event = { "BufReadPre", "BufNewFile" },
	config = function()
		-- import null-ls plugin
		local null_ls = require("null-ls")

		local null_ls_utils = require("null-ls.utils")

		-- for conciseness
		local formatting = null_ls.builtins.formatting -- to setup formatters
		local diagnostics = null_ls.builtins.diagnostics -- to setup linters

		-- to setup format on save
		local augroup = vim.api.nvim_create_augroup("LspFormatting", {})

		-- configure null_ls
		null_ls.setup({
			-- add package.json as identifier for root (for typescript monorepos)
			root_dir = null_ls_utils.root_pattern(".null-ls-root", "Makefile", ".git", "package.json"),
			-- setup formatters & linters
			sources = {
				--  to disable file types use
				--  "formatting.prettier.with({disabled_filetypes: {}})" (see null-ls docs)
				--formatting.prettier.with({
				--	extra_filetypes = { "svelte" },
				--}), -- js/ts formatter
				formatting.prettierd.with({
					filetypes = {
						"javascript",
						"javascriptreact",
						"typescript",
						"typescriptreact",
						"vue",
						"css",
						"scss",
						"less",
						"html",
						"json",
						"jsonc",
						"yaml",
						"markdown",
						"markdown.mdx",
						"graphql",
						"handlebars",
						"gotmpl",
					},
				}),
				formatting.stylua, -- lua formatter
				formatting.gofumpt, -- golang formatter
				-- formatting.goimports, -- golang imports
				diagnostics.eslint_d.with({ -- js/ts linter
					condition = function(utils)
						return utils.root_has_file({ ".eslintrc.js", ".eslintrc.cjs" }) -- only enable if root has .eslintrc.js or .eslintrc.cjs
					end,
				}),
			},
			-- configure format on save
			on_attach = function(current_client, bufnr)
				if current_client.supports_method("textDocument/formatting") then
					vim.api.nvim_clear_autocmds({ group = augroup, buffer = bufnr })
					vim.api.nvim_create_autocmd("BufWritePre", {
						group = augroup,
						buffer = bufnr,
						callback = function()
							vim.lsp.buf.format({
								filter = function(client)
									--  only use null-ls for formatting instead of lsp server
									return client.name == "null-ls"
								end,
								bufnr = bufnr,
							})
						end,
					})
				end
			end,
		})
	end,
}

Hello everyone! I came back to the JS and TS ecosystem after 5 years, attracted by Tailwind and Astro, which fit my current use cases perfectly. I've been struggling with this for the past week, trying to set up tooling (in particular, linting) for my team. When I do npx eslint . --debug, I get the following error:

TypeError: Error while loading rule 'astro/missing-client-only-directive-value': Cannot read properties of undefined (reading 'isAstro')
Occurred while linting /path/to/website/.vscode/extensions.json

and if it isn't this, it's an error like this:

TypeError: Error while loading rule 'perfectionist/sort-modules': sourceCode.getAllComments is not a function or its return value is not iterable
Occurred while linting /path/to/website/README.md

I get a variation of the above two errors, sometimes on JSON files, other times on Markdown or CSS files.

Here are the steps to repro the errors I have:

1. Run npm create astro@latest -- --install --no-git -y --template basics --add mdx,tailwind

2. Change directory to the directory it created for the project

3. Replace package.json with this (I know, not quite a MVP; the usage of Typescript isn't strictly necessary here for our purposes):

{
  "name": "tender-trappist",
  "type": "module",
  "version": "0.0.1",
  "scripts": {
    "dev": "astro dev",
    "build": "astro build",
    "preview": "astro preview",
    "astro": "astro",
    "prepare": "husky install",
    "lint": "eslint ."
  },
  "dependencies": {
    "@astrojs/check": "^0.9.4",
    "@astrojs/mdx": "^4.1.0",
    "@tailwindcss/vite": "^4.0.9",
    "astro": "^5.4.1",
    "tailwindcss": "^4.0.9"
  },
  "devDependencies": {
    "@eslint/css": "^0.4.0",
    "@eslint/js": "^9.21.0",
    "@eslint/json": "^0.10.0",
    "@eslint/markdown": "^6.3.0",
    "@html-eslint/eslint-plugin": "^0.35.2",
    "@html-eslint/parser": "^0.35.2",
    "@stylistic/eslint-plugin": "^4.2.0",
    "@types/eslint-plugin-jsx-a11y": "^6.10.0",
    "@typescript-eslint/parser": "^8.26.0",
    "eslint": "^9.22.0",
    "eslint-config-prettier": "^10.1.1",
    "eslint-mdx": "^3.1.5",
    "eslint-plugin-astro": "^1.3.1",
    "eslint-plugin-depend": "^0.12.0",
    "eslint-plugin-html": "^8.1.2",
    "eslint-plugin-jsx-a11y": "^6.10.2",
    "eslint-plugin-mdx": "^3.1.5",
    "eslint-plugin-no-loops": "^0.4.0",
    "eslint-plugin-perfectionist": "^4.10.1",
    "eslint-plugin-prettier": "^5.2.3",
    "eslint-plugin-unicorn": "^57.0.0",
    "globals": "^16.0.0",
    "prettier": "^3.5.3",
    "prettier-plugin-astro": "^0.14.1",
    "prettier-plugin-tailwindcss": "^0.6.11",
    "typescript": "^5.8.2",
    "typescript-eslint": "^8.26.0"
  },
  "lint-staged": {
    "*.js": "eslint --cache --fix",
    "*.ts": "eslint --cache --fix"
  }
}

then run npm install. Afterwards, add this following ESLint config:

// @ts-check

import css from "@eslint/css";
import { tailwindSyntax } from "@eslint/css/syntax";
import eslint from "@eslint/js";
import json from "@eslint/json";
import markdown from "@eslint/markdown";
import html from "@html-eslint/eslint-plugin";
import typescriptPlugin from "@typescript-eslint/eslint-plugin";
import typescriptParser from "@typescript-eslint/parser";
import eslintPluginAstro from "eslint-plugin-astro";
import * as depend from "eslint-plugin-depend";
import perfectionist from "eslint-plugin-perfectionist";
import eslintPluginPrettierRecommended from "eslint-plugin-prettier/recommended";
import eslintPluginUnicorn from "eslint-plugin-unicorn";
import globals from "globals";
import tseslint from "typescript-eslint";

export default tseslint.config(
  {
    ignores: ["package-lock.json", "dist/", ".astro/", "node_modules/"],
  },
  eslint.configs.recommended,
  ...[
    tseslint.configs.recommendedTypeChecked,
    tseslint.configs.stylisticTypeChecked,
  ].map((config) => ({
    ...config,
    files: ["**/*.ts"],
  })),
  depend.configs["flat/recommended"],
  eslintPluginUnicorn.configs.recommended,
  {
    rules: { "unicorn/expiring-todo-comments": "off" },
  },
  {
    files: ["**/*.md"],
    language: "markdown/gfm",
    plugins: { markdown },
    rules: {
      "markdown/fenced-code-language": "off",
      "markdown/heading-increment": "off",
      "markdown/no-missing-label-refs": "off",
    },
  },
  css.configs.recommended,
  {
    files: ["**/*.css"],
    language: "css/css",
    languageOptions: {
      customSyntax: tailwindSyntax,
      tolerant: true,
    },
  },
  {
    ...perfectionist.configs["recommended-alphabetical"],
    rules: {
      "perfectionist/sort-modules": "off",
    },
  },
  ...eslintPluginAstro.configs["flat/recommended"],
  {
    files: ["**/*.ts"],
    languageOptions: {
      parser: typescriptParser,
      parserOptions: {
        extraFileExtensions: [".astro", ".astro.ts"],
        projectService: true,
        tsconfigRootDir: import.meta.dirname,
      },
    },
    plugins: {
      "@typescript-eslint": typescriptPlugin,
    },
    rules: {
      ...typescriptPlugin.configs["recommended-type-checked"].rules,
      ...typescriptPlugin.configs["stylistic-type-checked"].rules,
    },
  },
  {
    files: ["**/*.html"],
    ...html.configs["flat/recommended"],
  },
  {
    files: ["**/*.json"],
    ignores: ["**/package-lock.json"],
    language: "json/json",
    ...json.configs.recommended,
  },
  {
    files: ["tsconfig.json", ".vscode/*.json"],
    language: "json/jsonc",
    ...json.configs.recommended,
  },
  {
    languageOptions: {
      ecmaVersion: 2022,
      globals: {
        ...globals.browser,
        ...globals.node,
      },
      sourceType: "module",
    },
  },
  {
    rules: {
      "no-irregular-whitespace": "off",
      "no-undef": "off",
    },
  },

  eslintPluginPrettierRecommended,
);

And now, when you do npx eslint ., you should see a message similar to this one:

Oops! Something went wrong! :(

ESLint: 9.22.0

TypeError: Error while loading rule 'astro/missing-client-only-directive-value': Cannot read properties of undefined (reading 'isAstro')
Occurred while linting /path/to/website/.vscode/extensions.json
    at Object.create (file:///path/to/website/node_modules/eslint-plugin-astro/lib/index.mjs:363:40)
    at createRuleListeners (/path/to/website/node_modules/eslint/lib/linter/linter.js:1006:21)
    at /path/to/website/node_modules/eslint/lib/linter/linter.js:1144:84
    at Array.forEach (<anonymous>)
    at runRules (/path/to/website/node_modules/eslint/lib/linter/linter.js:1075:34)
    at #flatVerifyWithoutProcessors (/path/to/website/node_modules/eslint/lib/linter/linter.js:2001:31)
    at Linter._verifyWithFlatConfigArrayAndWithoutProcessors (/path/to/website/node_modules/eslint/lib/linter/linter.js:2083:49)
    at Linter._verifyWithFlatConfigArray (/path/to/website/node_modules/eslint/lib/linter/linter.js:2172:21)
    at Linter.verify (/path/to/website/node_modules/eslint/lib/linter/linter.js:1626:61)
    at Linter.verifyAndFix (/path/to/website/node_modules/eslint/lib/linter/linter.js:2410:29)

It very rarely works if I reorder things in the config, but most of the time reordering results in ESLint either complaining about Markdown files or about CSS files, from a similar cause. I know there has to be a better way of doing this, so what is exactly conflicting to the point that ESLint can't see the specific JSON config (or CSS, or Markdown for that matter)? Is making ESLint flat configs just praying that the particular order of nested objects works as intended? I don't know of a more appropriate place to post this other than here (I could do it on r/javascript, but perhaps people over there might think it's tech support). Tips on how I could effectively debug ESLint configs would also be extremely appreciated, as --debug and printing the config haven't been best buddies with me (although they have helped me at times).

Thanks for your attention.