forEach is undefined when running `import/namespace`

[guoliang]

I'm trying to update to ESLint 9 and switch over to the flat config.

I'm getting the following error from eslint-import-plugin. Not sure why this is happening, so any help is appreciated.

[error] TypeError: Cannot read properties of undefined (reading 'forEach')
Occurred while linting /Users/abc/Development/infor/mashup-2/client/src/app/app-wizard/app-wizard.component.html:1
Rule: "import/namespace"
    at Program (/Users/abc/Development/infor/mashup-2/client/node_modules/eslint-plugin-import/lib/rules/namespace.js:85:18)
    at ruleErrorHandler (/Users/abc/Development/infor/mashup-2/client/node_modules/eslint/lib/linter/linter.js:1084:48)
    at /Users/abc/Development/infor/mashup-2/client/node_modules/eslint/lib/linter/safe-emitter.js:45:58
    at Array.forEach (<anonymous>)
    at Object.emit (/Users/abc/Development/infor/mashup-2/client/node_modules/eslint/lib/linter/safe-emitter.js:45:38)
    at NodeEventGenerator.applySelector (/Users/abc/Development/infor/mashup-2/client/node_modules/eslint/lib/linter/node-event-generator.js:297:26)
    at NodeEventGenerator.applySelectors (/Users/abc/Development/infor/mashup-2/client/node_modules/eslint/lib/linter/node-event-generator.js:326:22)
    at NodeEventGenerator.enterNode (/Users/abc/Development/infor/mashup-2/client/node_modules/eslint/lib/linter/node-event-generator.js:337:14)
    at runRules (/Users/abc/Development/infor/mashup-2/client/node_modules/eslint/lib/linter/linter.js:1128:40)
    at #flatVerifyWithoutProcessors (/Users/abc/Development/infor/mashup-2/client/node_modules/eslint/lib/linter/linter.js:1911:31)

My flat eslint.config.js looks as following

const eslint = require("@eslint/js");
const tseslint = require("typescript-eslint");
const angular = require("angular-eslint");
const importPlugin = require("eslint-plugin-import");

const eslintConfigPrettier = require("eslint-config-prettier");

let recommendedImport = {};
if (importPlugin.flatConfigs) {
	recommendedImport = { ...importPlugin.flatConfigs.recommended };
}
module.exports = [
	recommendedImport,
	eslintConfigPrettier,
	...tseslint.config(
		{
			files: ["**/*.ts"],
			extends: [
				eslint.configs.recommended,
				...tseslint.configs.recommended,
				...tseslint.configs.stylistic,
				...angular.configs.tsRecommended,
			],
			processor: angular.processInlineTemplates,
			rules: {
				"@angular-eslint/component-class-suffix": [
					"error",
					{
						suffixes: ["Base", "Component", "Container"],
					},
				],
				"@angular-eslint/directive-selector": [
					"error",
					{
						type: "attribute",
						prefix: "eir",
						style: "kebab-case",
					},
				],
				"@angular-eslint/component-selector": [
					"error",
					{
						type: "element",
						style: "kebab-case",
					},
				],

				"@typescript-eslint/no-wrapper-object-types": "error",
				"@typescript-eslint/no-unsafe-function-type": "error",
				"@typescript-eslint/no-empty-object-type": "off",
				"@typescript-eslint/no-restricted-types": [
					"error",
					{
						types: {
							Object: {
								message: "Avoid using the `Object` type. Did you mean `object`?",
								fixWith: "object",
							},
							Function: {
								message:
									"Avoid using the `Function` type. Prefer a specific function type, like `() => void`.",
							},
							Boolean: {
								message: "Avoid using the `Boolean` type. Did you mean `boolean`?",
							},
							Number: {
								message: "Avoid using the `Number` type. Did you mean `number`?",
							},
							String: {
								message: "Avoid using the `String` type. Did you mean `string`?",
							},
							Symbol: {
								message: "Avoid using the `Symbol` type. Did you mean `symbol`?",
							},
						},
					},
				],
				"@typescript-eslint/explicit-module-boundary-types": [
					"warn",
					{ allowArgumentsExplicitlyTypedAsAny: true },
				],
				"@typescript-eslint/explicit-function-return-type": [
					"error",
					{
						allowExpressions: true,
					},
				],
				"@typescript-eslint/no-explicit-any": "off",
				"@typescript-eslint/no-empty-function": ["warn", { allow: ["arrowFunctions", "methods"] }],
				"@typescript-eslint/no-empty-interface": ["error", { allowSingleExtends: true }],
				"@typescript-eslint/no-unused-vars": [
					"warn",
					{ argsIgnorePattern: "^_", varsIgnorePattern: "^_" },
				],
				"@typescript-eslint/no-unused-expressions": [
					"error",
					{ allowTernary: true, allowShortCircuit: true },
				],
				eqeqeq: "error",
				"import/no-duplicates": "off",
				"import/no-unresolved": ["off", { commonjs: true, amd: true }],
			},
		},
		{
			files: ["**/*.html"],
			extends: [...angular.configs.templateRecommended, ...angular.configs.templateAccessibility],
			rules: {
				"@angular-eslint/template/banana-in-box": "error",
				"@angular-eslint/template/eqeqeq": "error",
			},
		},
	),
];

[ljharb]

What version of the import plugin are you using?

[ljharb]

it's possible it's coming from the angular eslint parser - can you narrow it down to what source code is causing the problem?

[guoliang]

@ljharb
I'm using eslint-import-plugin: 2.31.0

Modified the setup also. Seems like I need to import it as following to get it to work

...
const importPlugin = require("eslint-plugin-import");

module.exports = [
	eslintConfigPrettier,
	...tseslint.config(
		{
			files: ["**/*.ts"],
			extends: [
				eslint.configs.recommended,
				...tseslint.configs.recommended,
				...tseslint.configs.stylistic,
				...angular.configs.tsRecommended,
			],
			plugins: {
				import: importPlugin,
			},

...

[ljharb]

So you did get it to work? or are you saying it doesn't when you include the import rules?