@nativescript/angular does not compile with @nativescript/core

[hamidbsd]

Environment
{N} 6.2

Describe the bug
Webpack compilation breaks with the following error

> [19-11-08 12:51:30.982] (CLI) ERROR in @nativescript/angular/common.ts(26,9): Error during template compile of 'NativeScriptCommonModule'
> [19-11-08 12:51:30.982] (CLI)   Could not resolve tns-core-modules/ui/frame relative to [object Object]. in 'defaultFrameProvider'
> [19-11-08 12:51:30.982] (CLI)     'defaultFrameProvider' contains the error at @nativescript/angular/platform-providers.ts(44,48).
> 

Expected behavior
To compile without any problems

Additional context
This file is causing the problem as it still tries to import from tns-core-modules instead of @nativescript/core.

nativescript-angular/nativescript-angular/platform-providers.ts

Lines 3 to 6 in 87c8cea

	import { Frame } from "tns-core-modules/ui/frame";
	import { View } from "tns-core-modules/ui/core/view";
	import { Page } from "tns-core-modules/ui/page";
	import { device, Device } from "tns-core-modules/platform";

[atchaiecommerce]

is the tns-core-modules deprecated at version 6.x.x?

[davecoffin]

I am getting this too.

[NickIliev]

@hamidbsd @davecoffin @atchaiecommerce this was indeed a bug that is addressed in the latest tns-core-modules. To resolve the issue either update to ``tns-core-modules version 6.3.1 or downgrade to version 6.2.0.

[davecoffin]

@NickIliev thanks for weighing in!
I tried to pin to 6.2.0 but i still get the error.

I removed tns-core-modules and nativescript-angular from my deps, was that the right move?

"@nativescript/angular": "8.20.0",
"@nativescript/core": "6.2.0",

I am running the 6.3 cli, would that also cause a problem?

[davecoffin]

In other news, I tried upgrading to 6.3.1 by removing @nativescript/angular and @nativescript/core from my deps, and adding this:

"nativescript-angular": "8.20.3",
"tns-core-modules": "6.3.1", 

but now I get this error:

ERROR in Cannot determine the module for class TextValueAccessor in /Users/davecoffin/Develop/presonus/mypxplat/apps/nativescript-myp/node_modules/nativescript-angular/node_modules/@nativescript/angular/forms/value-accessors/text-value-accessor.d.ts! Add TextValueAccessor to the NgModule to fix it.
Cannot determine the module for class CheckedValueAccessor in /Users/davecoffin/Develop/presonus/mypxplat/apps/nativescript-myp/node_modules/nativescript-angular/node_modules/@nativescript/angular/forms/value-accessors/checked-value-accessor.d.ts! Add CheckedValueAccessor to the NgModule to fix it.
Cannot determine the module for class DateValueAccessor in /Users/davecoffin/Develop/presonus/mypxplat/apps/nativescript-myp/node_modules/nativescript-angular/node_modules/@nativescript/angular/forms/value-accessors/date-value-accessor.d.ts! Add DateValueAccessor to the NgModule to fix it.
Cannot determine the module for class TimeValueAccessor in /Users/davecoffin/Develop/presonus/mypxplat/apps/nativescript-myp/node_modules/nativescript-angular/node_modules/@nativescript/angular/forms/value-accessors/time-value-accessor.d.ts! Add TimeValueAccessor to the NgModule to fix it.
Cannot determine the module for class NumberValueAccessor in /Users/davecoffin/Develop/presonus/mypxplat/apps/nativescript-myp/node_modules/nativescript-angular/node_modules/@nativescript/angular/forms/value-accessors/number-value-accessor.d.ts! Add NumberValueAccessor to the NgModule to fix it.
Cannot determine the module for class SelectedIndexValueAccessor in /Users/davecoffin/Develop/presonus/mypxplat/apps/nativescript-myp/node_modules/nativescript-angular/node_modules/@nativescript/angular/forms/value-accessors/selectedIndex-value-accessor.d.ts! Add SelectedIndexValueAccessor to the NgModule to fix it.

Executing webpack failed with exit code 2.

[davecoffin]

ok i finally got this figured out by upgrading to 6.3.1, removing @nativescript/core and @nativescript/angular from my deps and going back to nativescript-angular and tns-core-modules and switching all my imports back to tns-core-modules and nativescript-angular

But I guess my question @NickIliev is...how can i use the @nativescript/core and @nativescript/angular barrels?

[davecoffin]

I spoke too soon, it built but when running using aot i get this error when the app launched:
CONSOLE ERROR [native code]: ERROR Error: No component factory found for DetachedLoader. Did you add it to @NgModule.entryComponents?

[davecoffin]

ok i resolved this finally but am not entirely sure how haha.
reminds me of this effort: http://davecoffin.com/blog/11-16-17-how-i-got-webpack-to-work

a word of warning: dont import both tns-core-modules and @nativescript/core.

[PeterStaev]

@NickIliev , this is still a problem, even with the latest 6.3 packages. I just created a brand new NG app replaced all the deps to the scoped packages. Running w/o AoT compiles and runs the app just fine. Enabling AoT throws the error in the OP 😞

[davecoffin]

@PeterStaev are you importing @nativescript/core or tns-core-modules?

[PeterStaev]

@davecoffin , this is happening with a brand new project created with the 6.3 CLI that had all references updated to use the scoped packages. So there is no tns-core-modules anywhere in the project.

[davecoffin]

right, so i think this may be a problem with importing @nativescript/core in your dependencies and not tns-core-modules. They should be interchangeable, try removing @nativescript/core and adding tns-core-modules and see if you still see the error. Not saying thats a fix but could point @NickIliev to the solution.

[davecoffin]

@PeterStaev To be clear, keep importing from the barrel everywhere, just change to tns-core-modules: 6.3.1 in package.json

[PeterStaev]

So we still have to have BOTH @nativescript/core and tns-core-modules as deps? I thought this was supposed to be fixed in 6.3 already?
It will probably work (since the files will be there), but this defies the purpose/usage of the scoped packages.

This is not a production app, but a demo app for one of my plugins, so wont do anything. I already wrote in the release that there is a known issue and users will get an error if they use AoT and linked to this issue, so it is all in the hands of the NS Core Team 🙃

[davecoffin]

Actually you cant have both as deps, because each pulls in tns-core-modules-widgets, so if you have both you get an error that TNSWidget is created in two places.
@NickIliev The generated projects should probably be using the scoped imports, that would certainly point out any issues with them a lot faster.

[DimitarTachev]

Hi guys,

Thanks for your investigation and sorry for the late response. We've merged a fix in the nativescript-dev-webpack repository. You could give it a try by installing nativescript-dev-webpack@rc.

@davecoffin you can use both tns-core-modules and @nativescript/core, just keep them with the same version and the tns-core-modules-widgets package will be deduped by npm.

[dtopuzov]

Fix released with [email protected]

[asciidiego]

It fails with [email protected] @dtopuzov do you know what might be the cause? I am using NativeScript Angular 8.20.0, and the latest CLI with the latest 6.x version of NativeScript.