Property 'trace' does not exist on type 'typeof NxWelcomeService'.ts(2339)

Question

I am migrating my project to Nx Monorepo and it happens that libraries that worked fine in my project outside of Nx do not recognize public methods here. It doesn't happen only with libraries, I have created a simple component and service to test and it throws the same error This is the code nx-welcome.component.ts:

import { Component, OnInit } from '@angular/core';
import { NxWelcomeService } from './nx-welcome.service' 

@Component({
  selector: 'linde-tgv-nx-welcome',
  templateUrl: './nx-welcome.component.html',
  styles: []
})
export class NxWelcomeComponent implements OnInit {
  constructor() {
  };
  private logger = NxWelcomeService
  
  ngOnInit(): void {
    this.logger.trace('checklist-app - NxWelcomeComponent')
  }
}

nx-welcome.component.ts:

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

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

  constructor() { }
  
  public trace(message :string) {console.log(message)}
}

tsconfig.base.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "rootDir": ".",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "target": "es2015",
    "module": "esnext",
    "lib": ["es2017", "dom"],
    "skipLibCheck": true,
    "skipDefaultLibCheck": true,
    "baseUrl": ".",
    "paths": {
      "@linde-tgv/generated/linde-api-types": [
        "libs/generated/linde-api-types/src/index.ts"
      ],
      "@tgv/logger": ["libs/tgv-logger/src/index.ts"],
      "my-lib": [
        "dist/my-lib/my-lib",
        "dist/my-lib"
      ]
    }
  },
  "exclude": ["node_modules", "tmp"]
}

tsconfig.json

{
  "extends": "../../tsconfig.base.json",
  "files": [],
  "include": [],
  "references": [
    {
      "path": "./tsconfig.app.json"
    },
    {
      "path": "./tsconfig.spec.json"
    },
    {
      "path": "./tsconfig.editor.json"
    }
  ],
  "compilerOptions": {
    "target": "es2020",
    "forceConsistentCasingInFileNames": true,
    "strict": true,
    "noImplicitOverride": true,
    "noPropertyAccessFromIndexSignature": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true
  },
  "angularCompilerOptions": {
    "enableI18nLegacyMessageIdFormat": false,
    "strictInputAccessModifiers": true,
    "strictTemplates": true
  }
}

score 0 · Answer 1 · answered Aug 30 '22 at 15:59

0

Could you try importing as a injectable, inside the constructor.

import { Component, OnInit } from '@angular/core';
import { NxWelcomeService } from './nx-welcome.service' 

@Component({
  selector: 'linde-tgv-nx-welcome',
  templateUrl: './nx-welcome.component.html',
  styles: []
})
export class NxWelcomeComponent implements OnInit {
  constructor(private logger: NxWelcomeService) {
  };
  
  ngOnInit(): void {
    this.logger.trace('checklist-app - NxWelcomeComponent')
  }
}

answered Aug 30 '22 at 15:59

Naren Murali

19,250
3
27
54

I tried that too, Naren... the error persists. And also "No suitable injection token for parameter 'logger' of class 'NxWelcomeComponent. (-992003)" – Nestor Aug 30 '22 at 17:17
@Nestor have you tried adding NxWelcomeService inside the providers array of a module? could you also check by adding it to the providers array of the component decorator `@Component({ selector: 'linde-tgv-nx-welcome', templateUrl: './nx-welcome.component.html', styles: [], providers: [NxWelcomeService] })` – Naren Murali Aug 30 '22 at 17:21

score 0 · Accepted Answer · answered Aug 31 '22 at 18:31

0

The problem was not with NX. I had defined

private logger = NxWelcomeService

rather than

constructor(private logger: NxWelcomeService)

answered Aug 31 '22 at 18:31

Nestor

1
1

Property 'trace' does not exist on type 'typeof NxWelcomeService'.ts(2339)

2 Answers2