Bug: Type Issue in Angular Project

[rgant]

Describe the bug

Started a new Angular v19 project and am getting the following error in my LSP when importing eslint-plugin-perfectionist:

error Cannot find module 'eslint-plugin-perfectionist' or its corresponding type declarations. ​typescript(2307)
There are types at '.../node_modules/eslint-plugin-perfectionist/dist/index.d.ts', but this result could not be resolved under your current 'moduleResolution' setting. Consider updating to 'node16', 'nodenext', or 'bundler'.

Code example

My eslint.config.js:

// @ts-check
const eslint = require('@eslint/js');
const tseslint = require('typescript-eslint');
const angular = require('angular-eslint');
const perfectionist = require('eslint-plugin-perfectionist');

module.exports = tseslint.config(
  {
    files: ['**/*.ts'],
    extends: [
      eslint.configs.all,
      tseslint.configs.all,
      perfectionist.configs['recommended-natural'],
    ],
    languageOptions: {
      parserOptions: {
        projectService: true,
      },
    },
    linterOptions: {
      reportUnusedDisableDirectives: 'error',
    },
    processor: angular.processInlineTemplates,
  },
);

ESLint version

v9.17.0

ESLint Plugin Perfectionist version

v4.6.0

Additional comments

My tsconfig:

/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "esModuleInterop": true,
    "experimentalDecorators": true,
    "forceConsistentCasingInFileNames": true,
    "importHelpers": true,
    "isolatedModules": true,
    "module": "ES2022",
    "moduleResolution": "bundler",
    "noFallthroughCasesInSwitch": true,
    "noImplicitOverride": true,
    "noImplicitReturns": true,
    "noPropertyAccessFromIndexSignature": true,
    "noUncheckedIndexedAccess": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "outDir": "./dist/out-tsc",
    "paths": {
      "@app/*": ["./src/app/*"],
      "@testing/*": ["./src/testing/*"]
    },
    "skipLibCheck": true,
    "sourceMap": true,
    "strict": true,
    "target": "ES2022"
  },
  "angularCompilerOptions": {
    "enableI18nLegacyMessageIdFormat": false,
    "strictInjectionParameters": true,
    "strictInputAccessModifiers": true,
    "strictStandalone": true,
    "strictTemplates": true
  }
}

Validations

• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.

[hugop95]

Hi @rgant, could you provide your package.json as well please?

[rgant]

package.json

{
  "name": "demoapp",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "build": "ng build",
    "lint": "ng lint",
    "ng": "ng",
    "start": "ng serve",
    "stylelint": "stylelint --quiet-deprecation-warnings src/",
    "test": "ng test",
    "watch": "ng build --watch --configuration development"
  },
  "dependencies": {
    "@angular/animations": "^19.0.0",
    "@angular/common": "^19.0.0",
    "@angular/compiler": "^19.0.0",
    "@angular/core": "^19.0.0",
    "@angular/fire": "^19.0.0-rc.4",
    "@angular/forms": "^19.0.0",
    "@angular/platform-browser": "^19.0.0",
    "@angular/platform-browser-dynamic": "^19.0.0",
    "@angular/router": "^19.0.0",
    "@angular/service-worker": "^19.0.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.15.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^19.0.7",
    "@angular/cli": "^19.0.7",
    "@angular/compiler-cli": "^19.0.0",
    "@smarttools/eslint-plugin-rxjs": "^1.0.13",
    "@stylistic/eslint-plugin": "^2.12.1",
    "@stylistic/stylelint-config": "^2.0.0",
    "@types/jasmine": "~5.1.0",
    "angular-eslint": "19.0.2",
    "cypress": "^13.17.0",
    "eslint": "^9.17.0",
    "eslint_d": "^14.3.0",
    "eslint-import-resolver-typescript": "^3.7.0",
    "eslint-plugin-import-x": "^4.6.1",
    "eslint-plugin-perfectionist": "^4.6.0",
    "eslint-plugin-prefer-arrow-functions": "^3.4.1",
    "eslint-plugin-promise": "^7.2.1",
    "eslint-plugin-tsdoc": "^0.4.0",
    "eslint-plugin-unicorn": "^56.0.1",
    "jasmine-core": "~5.4.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.1.0",
    "stylelint-config-clean-order": "^7.0.0",
    "stylelint-config-standard-scss": "^14.0.0",
    "stylelint-declaration-block-no-ignored-properties": "^2.8.0",
    "stylelint-declaration-strict-value": "^1.10.7",
    "stylelint-high-performance-animation": "^1.10.0",
    "stylelint-no-indistinguishable-colors": "^2.3.0",
    "stylelint-no-unsupported-browser-features": "^8.0.2",
    "stylelint-plugin-defensive-css": "^1.0.4",
    "stylelint-plugin-logical-css": "^1.2.1",
    "stylelint-use-nesting": "^6.0.0",
    "typescript": "~5.6.2",
    "typescript-eslint": "8.18.0"
  },
  "engines": {
    "node": "v20.18.1",
    "npm": "10.8.2"
  }
}

[hugop95]

@rgant Unfortunately, I could not replicate your error:

• Created a new project with the given package.json, eslint.config.js and tsconfig.json.
• Created a test file in a src folder.
• Ran eslint src/.

Errors are displayed correctly.

Could you please:

• Create a repository for easy reproduction on our side.
• Tell us what command you are running (ng lint?).

[rgant]

Sorry, I was not clear. eslint is functioning just fine. And I forgot to include the // @ts-check pragma for the eslint.config.js file. Now added.

The issue is in the Language Server I am using in my editor reports this issue when opening the eslint.config.js file. It is merely annoying. If the cause and solution are not obvious to you then I am happy to close the ticket.

[azat-io]

I have not been able to reproduce the problem either. It would be great if you could create a small repository where we could see the problem.

[hugop95]

I don't use Sublime, so it's unfortunately not straightforward to reproduce for me.

[rgant]

Sorry, this does not have anything to do with the execution of eslint or the code in the project. It may have something to do with using a cjs eslint config in a TS project. It is entirely an issue with a developer environment setup. You would need to be using my editor, with my configuration, to see the same issue as I am.

My hope was that just the error message would indicate a source of the problem or solution. The only case of this message I can find on the web is here. But it is unclear to me how those changes solved the issue.

If you want to do all that setup, then the code is here. But it sounds like the best thing to do is just close this ticket.

[hugop95]

@rgant If you remove the perfectionist import, do you still get the error for other modules?

[rgant]

This is the only plugin with this exact issue.

eslint-plugin-rxjs resolved a similar but different missing types issue I reported.

eslint-plugin-prefer-arrow-functions uses a default export that has some difficulty being used in ESM module imports.

All these plugins function correctly when running eslint it is just the LSP type system complaining about this one plugin.

[azat-io]

Can you run type check via terminal?

tsc --noEmit --pretty

And do you have the ability to create a repository to reproduce the problem?

[hugop95]

@azat-io @rgant

I would say that if your compilation and ESLint commands work, the issue might be within Sublime and/or how it's configured. Does it work with a different moduleResolution?

[rgant]

I created a new minimal repo. As you say this is an issue with Sublime-LSP. In this version I do not see the large error message, however I am unable to "Goto Type Definition" or "Goto Definition" on eslint-plugin-perfectionist. It works for @eslint/js, globals, and typescript-eslint. So there does seem to be something different about this (awesome) plugin. However it is unclear to me what is different.

LSP logs

:: [10:12:56.732] --> LSP-typescript textDocument/typeDefinition (155): {'textDocument': {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/eslint.config.mjs'}, 'position': {'line': 1, 'character': 18}, 'workDoneToken': '$ublime-work-done-progress-155'}
:: [10:12:56.733] <<< LSP-typescript (155) (duration: 1ms): []
:: [10:13:11.482] --> LSP-typescript textDocument/documentHighlight (156): {'textDocument': {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/eslint.config.mjs'}, 'position': {'line': 2, 'character': 11}}
:: [10:13:11.485] --> LSP-angular textDocument/codeAction (79): {'textDocument': {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/eslint.config.mjs'}, 'range': {'start': {'line': 2, 'character': 11}, 'end': {'line': 2, 'character': 11}}, 'context': {'diagnostics': [], 'triggerKind': 2}}
:: [10:13:11.486] --> LSP-typescript textDocument/codeAction (157): {'textDocument': {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/eslint.config.mjs'}, 'range': {'start': {'line': 2, 'character': 11}, 'end': {'line': 2, 'character': 11}}, 'context': {'diagnostics': [], 'triggerKind': 2}}
:: [10:13:11.489] <<< LSP-angular (79) (duration: 3ms): None
:: [10:13:11.489] <<< LSP-typescript (156) (duration: 7ms): [{'kind': 2, 'range': {'start': {'line': 2, 'character': 7}, 'end': {'line': 2, 'character': 14}}}, {'kind': 2, 'range': {'start': {'line': 21, 'character': 31}, 'end': {'line': 21, 'character': 38}}}]
:: [10:13:11.504] <<< LSP-typescript (157) (duration: 17ms): []
:: [10:13:15.172] --> LSP-typescript textDocument/typeDefinition (158): {'textDocument': {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/eslint.config.mjs'}, 'position': {'line': 2, 'character': 11}, 'workDoneToken': '$ublime-work-done-progress-158'}
:: [10:13:15.175] <<< LSP-typescript (158) (duration: 2ms): [{'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/node_modules/globals/index.d.ts', 'range': {'start': {'line': 3045, 'character': 15}, 'end': {'line': 3092, 'character': 1}}}]
:: [10:13:15.237]  -> LSP-typescript textDocument/didOpen: <params with 105032 characters>
:: [10:13:15.253] --> LSP-typescript textDocument/codeLens (159): {'textDocument': {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/node_modules/globals/index.d.ts'}}
:: [10:13:15.256]  -> LSP-angular textDocument/didOpen: <params with 105032 characters>
:: [10:13:15.261] --> LSP-typescript textDocument/codeLens (160): {'textDocument': {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/node_modules/globals/index.d.ts'}}
:: [10:13:15.268] --> LSP-typescript textDocument/codeLens (161): {'textDocument': {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/node_modules/globals/index.d.ts'}}
:: [10:13:15.269] <<< LSP-typescript (159) (duration: 15ms): []
:: [10:13:15.270] <<< LSP-typescript (160) (duration: 8ms): []
:: [10:13:15.276] <<< LSP-typescript (161) (duration: 7ms): []
:: [10:13:15.572] --> LSP-typescript textDocument/documentHighlight (162): {'textDocument': {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/node_modules/globals/index.d.ts'}, 'position': {'line': 3045, 'character': 15}}
:: [10:13:15.573] --> LSP-typescript textDocument/codeAction (163): {'textDocument': {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/node_modules/globals/index.d.ts'}, 'range': {'start': {'line': 3045, 'character': 15}, 'end': {'line': 3045, 'character': 15}}, 'context': {'diagnostics': [], 'triggerKind': 2}}
:: [10:13:15.573] --> LSP-angular textDocument/codeAction (80): {'textDocument': {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/node_modules/globals/index.d.ts'}, 'range': {'start': {'line': 3045, 'character': 15}, 'end': {'line': 3045, 'character': 15}}, 'context': {'diagnostics': [], 'triggerKind': 2}}
:: [10:13:15.573] <<< LSP-typescript (162) (duration: 1ms): []
:: [10:13:15.574] <<< LSP-angular (80) (duration: 0ms): None
:: [10:13:15.580] <<< LSP-typescript (163) (duration: 6ms): [{'title': 'Move to a new file', 'kind': 'refactor.move', 'command': {'title': 'Move to a new file', 'command': '_typescript.applyRefactoring', 'arguments': [{'file': '/Users/rgant/Programming/tmp-eslint-perfectionist-test/node_modules/globals/index.d.ts', 'startLine': 3046, 'startOffset': 16, 'endLine': 3046, 'endOffset': 16, 'refactor': 'Move to a new file', 'action': 'Move to a new file'}]}}]
:: [10:13:15.602] <-  LSP-typescript textDocument/publishDiagnostics: {'uri': 'file:///Users/rgant/Programming/tmp-eslint-perfectionist-test/node_modules/globals/index.d.ts', 'diagnostics': []}

I'll try to ask the developers of inkonchain/docs about the error message they resolved to see if there is more information. And I'll open a ticket with Sublime-LSP about this issue.

However, at this point I plan to move on from the issue as I rarely open the eslint.config.js file so this message is not currently impacting my workflow significantly.