Angular ^17模块与服务无法识别的报错排查求助

我通过ng g命令创建服务，理论上应该自动完成配置，但控制台却抛出错误与警告。功能看似能正常运行，但报错始终存在，十分困扰。

服务代码 #

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

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

组件中的导入方式 #

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

控制台报错信息 #

▲ [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';

已尝试的方案（未解决） #

• 手动在tsconfig中配置路径
• 修改module版本

附：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
  }
}

解决方案 #

1. 检查服务文件完整性 #

TS报错提示文件为二进制，大概率是NameServices.service.ts文件损坏、编码异常或内容为空。用文本编辑器打开该文件，确认代码完整且无特殊乱码字符；若异常，直接删除文件后重新执行ng g service @core/utils/NameServices重建服务。

2. 修正tsconfig.json的include范围 #

当前tsconfig仅包含./src/app/@core/**/*，但组件位于src/app/pages/目录下，编译器无法完整关联组件与服务的依赖关系。修改include配置为：

"include": ["./src/**/*"]

覆盖所有src目录下的TS文件，确保编译范围完整。

3. 校验导入与导出的一致性 #

• 确认服务类名NameServices的大小写与导入语句完全一致（TS对文件名、类名大小写敏感）
• 检查导入路径的拼写是否正确，避免路径层级错误

4. 关于AppModule配置 #

由于服务使用了providedIn: 'root'，无需手动在AppModule的providers数组中注册，当前配置是正确的，无需修改。

5. 清理缓存并重新构建 #

执行以下命令清理Angular缓存并重新构建项目：

ng clean
ng build

缓存残留可能导致编译逻辑异常，清理后可解决部分奇怪的报错。

内容的提问来源于stack exchange，提问作者Valery Vyglyad