tawk / tawk-messenger-angular

Official Angular plugin for Tawk messenger
https://www.tawk.to/
Other
6 stars 2 forks source link

Not able to resolve the service - @tawk.to/tawk-messenger-angular - TawkMessengerAngular #16

Open rahulphoke opened 1 year ago

rahulphoke commented 1 year ago

simple code just like below throws error import { Component } from '@angular/core'; import { TawkMessengerAngular } from '@tawk.to/tawk-messenger-angular/dist/tawk-messenger-angular'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'], }) export class AppComponent { title = 'test-tawk'; constructor(public TawkMessengerAngular: TawkMessengerAngular) {} ngOnInit(): void { this.TawkMessengerAngular.init({ propertyId: "[propertyId]", widgetId: "[widgetId]", }); } }

main.ts:6 ERROR Error: inject() must be called from an injection context at injectInjectorOnly (core.mjs:4761:15) at Module.ɵɵinject (core.mjs:4771:60) at Object.TawkMessengerAngular_Factory [as factory] (tawk.to-tawk-messenger-angular.mjs:220:106) at R3Injector.hydrate (core.mjs:9301:35) at R3Injector.get (core.mjs:9189:33) at ChainedInjector.get (core.mjs:13009:36) at lookupTokenUsingModuleInjector (core.mjs:4436:39) at getOrCreateInjectable (core.mjs:4484:12) at Module.ɵɵdirectiveInject (core.mjs:10780:12) at NodeInjectorFactory.AppComponent_Factory [as factory] (app.component.ts:8:26)

Hasan-git commented 10 months ago

Module not found: Error: Can't resolve '@tawk/tawk-messenger-angular' same here

Ephron-WL commented 5 months ago

Same here. The package construction is poor. If ttawk.to decided to fix their package structure then we wouldn't have this issue.

See this issue for a solution: #13

muratcorlu commented 5 months ago

Is this the only problem in this project? I couldn't figure out how to run this. I thought we need also to import a module, and tried to add it to imports

import { TawkMessengerAngularModule } from '@tawk.to/tawk-messenger-angular/dist/tawk-messenger-angular';

@NgModule({
  imports: [
    RouterModule.forChild(routes),
    TawkMessengerAngularModule,
  ],
  exports: [RouterModule],
})
export class LayoutPageRoutingModule {}

But I'm still getting dependency injection errors.

Should we consider this project (I mean Angular plugin) already died?

Ephron-WL commented 5 months ago

Is this the only problem in this project? I couldn't figure out how to run this. I thought we need also to import a module, and tried to add it to imports

import { TawkMessengerAngularModule } from '@tawk.to/tawk-messenger-angular/dist/tawk-messenger-angular';

@NgModule({
  imports: [
    RouterModule.forChild(routes),
    TawkMessengerAngularModule,
  ],
  exports: [RouterModule],
})
export class LayoutPageRoutingModule {}

But I'm still getting dependency injection errors.

Should we consider this project (I mean Angular plugin) already died?

One gets the sense that tawk.to has abandoned this project. They don't even respond to issue posts.

Refer to the first block of code here: https://github.com/tawk/tawk-messenger-angular/blob/main/docs/directives.md

You are missing an import and a provider

One other problem I had was their inclusion of node_modules within their package. When I deleted this folder it compiled. By deleting it, NPM will resolve dependencies using the libraries that are already included in your project.

Their "how to use" section is incomplete and disappointing. I personally do not use this product since I have other issues with their offering, but I did successfully implement it using this package prior to making that decision.

muratcorlu commented 5 months ago

@Ephron-WL thanks for the detailed explanation. I get the message to avoid this trouble 😊

doteq commented 4 months ago

So I think the problem is that they published the package incorrectly - they should've done it from /dist/tawk-messenger-angular directory, not from root. Because of that import { TawkMessengerAngular } from '@tawk.to/tawk-messenger-angular; fails - the actual package is in dist directory.

To fix that you can use gitpkg to install package from /dist/tawk-messenger-angular directory:

yarn add 'https://gitpkg.now.sh/tawk/tawk-messenger-angular/dist/tawk-messenger-angular?main'

and then it should work correctly.

pavan-singh-iphtech commented 2 months ago

Module not found: Error: Can't resolve '@tawk/tawk-messenger-angular' same here

I am also facing same issue

pavan-singh-iphtech commented 2 months ago

Is this the only problem in this project? I couldn't figure out how to run this. I thought we need also to import a module, and tried to add it to imports

import { TawkMessengerAngularModule } from '@tawk.to/tawk-messenger-angular/dist/tawk-messenger-angular';

@NgModule({
  imports: [
    RouterModule.forChild(routes),
    TawkMessengerAngularModule,
  ],
  exports: [RouterModule],
})
export class LayoutPageRoutingModule {}

But I'm still getting dependency injection errors. Should we consider this project (I mean Angular plugin) already died?

One gets the sense that tawk.to has abandoned this project. They don't even respond to issue posts.

Refer to the first block of code here: https://github.com/tawk/tawk-messenger-angular/blob/main/docs/directives.md

You are missing an import and a provider

One other problem I had was their inclusion of node_modules within their package. When I deleted this folder it compiled. By deleting it, NPM will resolve dependencies using the libraries that are already included in your project.

Their "how to use" section is incomplete and disappointing. I personally do not use this product since I have other issues with their offering, but I did successfully implement it using this package prior to making that decision.

I have read all but still throw error