We have an NX Workspace with different Angular apps and migrated to NX 20.4.0 and Angular 19.x (below the specific libs):
"@angular/core": "19.1.4",
"@angular-eslint/eslint-plugin": "19.0.2",
"@angular-eslint/eslint-plugin-template": "19.0.2",
"@angular-eslint/template-parser": "19.0.2",
"@eslint/eslintrc": "^3.2.0",
"@eslint/js": "9.19.0",
"@ngrx/schematics": "19.0.1",
"@nx/angular": "20.4.0",
"@nx/eslint": "20.4.0",
"@nx/eslint-plugin": "^20.4.0",
"@nx/js": "20.4.0",
"eslint": "9.19.0",
"eslint-config-prettier": "9.1.0",
Following the NX Docs we migrated the eslintrc.json configs to the new flat format with the command:
nx g @nx/eslint:convert-to-flat-config
Everything went good, but now running a lint command triggers the following error:
NX Only URLs with a scheme in: file, data, and node are supported by
the default ESM loader. Received protocol 'eslint-plugin-plugin:'
This comes from the root eslint.config.mjs
file:
import { FlatCompat } from '@eslint/eslintrc';
import { dirname } from 'path';
import { fileURLToPath } from 'url';
import js from '@eslint/js';
import nxEslintPlugin from '@nx/eslint-plugin';
import eslintPluginCustomRules from 'eslint-plugin-custom-rules';
import eslintPluginPluginNxAngular from 'eslint-plugin-plugin:@nx/angular'; <---
const compat = new FlatCompat({
baseDirectory: dirname(fileURLToPath(import.meta.url)),
recommendedConfig: js.configs.recommended,
});
export default [
{
ignores: ['**/dist'],
},
{
plugins: {
'@nx': nxEslintPlugin,
'custom-rules': eslintPluginCustomRules,
'plugin:@nx/angular': eslintPluginPluginNxAngular, <----
},
},
{
files: ['**/*.ts', '**/*.tsx', '**/*.js', '**/*.jsx'],
rules: {
'@typescript-eslint/parser': 'off',
'@angular-eslint/prefer-standalone': 'off',
'@nx/enforce-module-boundaries': [
'error',
{
enforceBuildableLibDependency: true,
allow: [],
},
],
},
},
..pat
.config({
extends: ['plugin:@nx/typescript'],
})
The migration script generated the import path. I even tried to use: import eslintPluginPluginNxAngular from '@nx/angular';
but this then triggers another error inside the library in the node_modules:
NX Cannot find package '@ngrx/router-store' imported from
.../node_modules/@nx/angular/fesm2022/nx-angular.mjs
Aside many people having different issues in migrating eslint to the new format, I could not find a solution to my issue. It seems to me a basic import/path misconfiguration but I cannot find a way to fix it yet.