angulartypescriptservicecommentsjsdoc

Why does Angular ^17 have problems with my modules, services, etc


Perhaps it was already somewhere in the themes. But I couldn't find a similar question. And the question is why Angular can't find modules and services. I create through "ng g", it seems that everything should be tightened. But it gives you an error or a warning.

The service itself has several methods (functions):

import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})
export class NameServices{...}

How do I import it into a component:

import {NameServices} from '../../@core/utils/NameServices.service';

Problems that arise in the console:

▲ [WARNING] Import "NameServices" will always be undefined because the file "src/app/@core/utils/NameServices.service.ts" has no exports [import-is-undefined]

    src/app/pages/home/home.component.ts:5:9:
      5 │ import {NameServices} from '../../@core/utils/NameServi...
        ╵          ~~~~~~~~~~~~~~~~~~~~~~~


X [ERROR] TS1490: File appears to be binary. [plugin angular-compiler]

    src/app/@core/utils/NameServices.service.ts:0:0:
      0 │
        ╵ ^


X [ERROR] TS2306: File '*:/Projects/client/src/app/@core/utils/NameServices.service.ts' is not a module. [plugin angular-compiler]

    src/app/pages/home/home.component.ts:7:38:
      7 │ ...rvices} from '../../@core/utils/NameServices.service';

I've already tried to change a lot of things. And in tsconfig, I prescribed the paths manually, changed the "module" versions, and so on, which usually causes many problems.

Perhaps it is necessary to tighten dependencies in App.module.ts?

(It seems to be working. But I'm tired of this dirt in the console.)

PS: tsconfig.json

{
  "compileOnSave": false,
  "include": ["./src/app/@core/**/*"],
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "noImplicitOverride": true,
    "noPropertyAccessFromIndexSignature": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "sourceMap": true,
    "declaration": false,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "ES2022",
    "module": "ES2022",
    "useDefineForClassFields": false,
    "lib": [
      "ES2022",
      "dom"
    ]
  },
  "angularCompilerOptions": {
    "enableI18nLegacyMessageIdFormat": false,
    "strictInjectionParameters": true,
    "strictInputAccessModifiers": true,
    "strictTemplates": true
  }
}

Solution

  • The decision was sudden and easy. It's all about Angular conflict with JSDoc. Comments like @param turned out to be readable by the framework.

    I also noticed that it depends on the encoding of the file. For example, in windows 1252, Cyrillic gives these errors. And there are no errors in utf-8 with Cyrillic!