Aspnetboilerplate: Upgrade to Angular v9

[maxkol]

https://blog.angular.io/version-9-of-angular-now-available-project-ivy-has-arrived-23c97b63cfa3

[ismcagdas]

@maxkol thank you for creating the issue. We can upgrade Angular template to v9 with the next version.

[maxkol]

@ismcagdas thank you
Could you say something about due date of v5.3?

[ismcagdas]

@maxkol hard to say. I haven't checked the breaking changes and major changes in Angular 9 yet.

[hikalkan]

I believe we can wait for 9.1 :)

[kingemma]

Hello,
Do you have any solution for missing abp when upgrade Angular to 9?
Thanks.

[Alex61NN5]

@kingemma Have you found a solution for this?

[bvdwalt]

We're also running into the same now, if anyone has a solution or suggestions.

[ismcagdas]

@bvdwalt recently released v6.0 of https://github.com/aspnetboilerplate/abp-ng2-module. Could you upgrade your project accordingly ?

Basically;

• You can remove imports of AbpModule
• import everyting else from 'abp-ng2-module'. For example instead of import { UtilsService } from '@abp/utils/utils.service'; use import { UtilsService } from 'abp-ng2-module';

[bvdwalt]

Hi @ismcagdas, my issue is more to do with importing the abp namespace found in "abp-web-resources/Abp/Framework/scripts/abp.d.ts" which is in the npm package "abp-web-resources" and not in abp-ng2-module. So I don't think this will help me.

[ismcagdas]

Could you create a new issue and explain your problem ? If you have any error message, please also share it.

[maxkol]

I believe we can wait for 9.1 :)
You were right :)

https://blog.angular.io/version-9-1-of-angular-now-available-typescript-3-8-faster-builds-and-more-eb292f989428

[koderi-dp]

Hi @ismcagdas, my issue is more to do with importing the abp namespace found in "abp-web-resources/Abp/Framework/scripts/abp.d.ts" which is in the npm package "abp-web-resources" and not in abp-ng2-module. So I don't think this will help me.

same problem, just create clean angular 9 project, add abp-ng2-module, abp-web-resources, add in angular.json scripts

"node_modules/abp-web-resources/Abp/Framework/scripts/abp.js",
"node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.jquery.js",
....

first it will not resolve abp namespace, example if you are using
abp.ajax or abp.clock etc.. then you add typings.d.ts in src with reference
///<reference path="../node_modules/abp-web-resources/Abp/Framework/scripts/abp.d.ts"/> ///<reference path="../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.jquery.d.ts"/>
......
then it will resolve, but when you build it will go back to node module reporting

///<reference types="abp-web-resources" /> node_modules/abp-ng2-module/lib/services/utils/utils.service.d.ts:1:23 - error TS2688: Cannot find type definition file for 'abp-web-resources'. ///<reference types="abp-web-resources" /> node_modules/abp-ng2-module/lib/services/abp-user-configuration.service.d.ts:1:23 - error TS2688: Cannot find type definition file for 'abp-web-resources'.

so if someone did manage to set up with angular 9 latest abp-ng2-module 6.0 with abp-web-resources successfully please share.

[ismcagdas]

This might work;

1. Create a typings.d.ts in the same folder with tsconfig.json (or /tsconfig.app.json) and include lines below into typings.d.ts file.

///<reference path="../node_modules/abp-web-resources/Abp/Framework/scripts/abp.d.ts"/>
///<reference path="../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.jquery.d.ts"/>
///<reference path="../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.signalr.d.ts"/>

1. Add this to include section of your tsconfig file;

"include": [
    "src/**/*.d.ts",
    "typings.d.ts"
  ]

[toanml]

This might work;

1. Create a typings.d.ts in the same folder with tsconfig.json (or /tsconfig.app.json) and include lines below into typings.d.ts file.

///<reference path="../node_modules/abp-web-resources/Abp/Framework/scripts/abp.d.ts"/>
///<reference path="../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.jquery.d.ts"/>
///<reference path="../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.signalr.d.ts"/>

1. Add this to include section of your tsconfig file;

"include": [
    "src/**/*.d.ts",
    "typings.d.ts"
  ]

It still doesn't work for me.
It shows error when run "ng build"

src/root.module.ts:77:12 - error TS2304: Cannot find name 'abp'.

77 return abp.localization.currentLanguage.name && abp.localization.currentLanguage.name !== 'en-US'
~~~
src/root.module.ts:77:53 - error TS2304: Cannot find name 'abp'.

77 return abp.localization.currentLanguage.name && abp.localization.currentLanguage.name !== 'en-US'
~~~
src/root.module.ts:85:12 - error TS2304: Cannot find name 'abp'.

85 return abp.localization.currentLanguage.name

[ismcagdas]

If you can share a reproduction project, we can take a look.

[toanml]

If you can share a reproduction project, we can take a look.

https://drive.google.com/file/d/138MdT4fzo2JjG2Vb-clikJeX5LzYz5rs/view?usp=sharing
Do you need the source code of my .netcore project?

[Updated] I found my mistake and got other errors, lol. I did roleback all updating and did it again step by step.

When I enable Ivy to compile, it compiles successfully, but the website can be loaded because there is an error in console.
P/S: I have updated the shared link.

core.js:4061 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'id' of undefined
TypeError: Cannot read property 'id' of undefined
at registerNgModuleType (core.js:24498)
at core.js:24509
at Array.forEach ()
at registerNgModuleType (core.js:24509)
at core.js:24509
at Array.forEach ()
at registerNgModuleType (core.js:24509)
at new NgModuleFactory (core.js:24609)
at Compiler_compileModuleSync__POST_R3__ (core.js:27477)
at Compiler_compileModuleAsync__POST_R3__ [as compileModuleAsync] (core.js:27482)
at resolvePromise (zone.js:832)
at resolvePromise (zone.js:784)
at zone.js:894
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
at Object.onInvokeTask (core.js:27859)
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
at Zone.push../node_modules/zone.js/d

[ismcagdas]

@toanml I have tried but couldn't run your project. It keeps throwing error below;

Application startup exception: Castle.MicroKernel.ComponentActivator.ComponentActivatorException: ComponentActivator: could not instantiate Microsoft.AspNetCore.Server.IIS.Core.IISHttpServer
 ---> System.Exception: Could not instantiate Microsoft.AspNetCore.Server.IIS.Core.IISHttpServer.
 ---> System.Reflection.TargetInvocationException: Exception has been thrown by the target of an invocation.
 ---> System.NullReferenceException: Object reference not set to an instance of an object.
   at Microsoft.AspNetCore.Hosting.WebHostBuilderIISExtensions.<>c__DisplayClass0_0.<UseIIS>b__2(IISServerOptions options)
   at Microsoft.Extensions.Options.ConfigureNamedOptions`1.Configure(String name, TOptions options)
   at Microsoft.Extensions.Options.OptionsFactory`1.Create(String name)
   at Microsoft.Extensions.Options.OptionsManager`1.<>c__DisplayClass5_0.<Get>b__0()
   at System.Lazy`1.ViaFactory(LazyThreadSafetyMode mode)
   at System.Lazy`1.ExecutionAndPublication(LazyHelper executionAndPublication, Boolean useDefaultConstructor)
   at System.Lazy`1.CreateValue()
   at System.Lazy`1.get_Value()
   at Microsoft.Extensions.Options.OptionsCache`1.GetOrAdd(String name, Func`1 createOptions)
   at Microsoft.Extensions.Options.OptionsManager`1.Get(String name)
   at Microsoft.Extensions.Options.OptionsManager`1.get_Value()
   at Microsoft.AspNetCore.Server.IIS.Core.IISHttpServer..ctor(IISNativeApplication nativeApplication, IHostApplicationLifetime applicationLifetime, IAuthenticationSchemeProvider authentication, IOptions`1 options, ILogger`1 logger)
   --- End of inner exception stack trace ---
   at System.RuntimeMethodHandle.InvokeMethod(Object target, Object[] arguments, Signature sig, Boolean constructor, Boolean wrapExceptions)
   at System.Reflection.RuntimeConstructorInfo.Invoke(BindingFlags invokeAttr, Binder binder, Object[] parameters, CultureInfo culture)
   at System.RuntimeType.CreateInstanceImpl(BindingFlags bindingAttr, Binder binder, Object[] args, CultureInfo culture)
   at System.Activator.CreateInstance(Type type, BindingFlags bindingAttr, Binder binder, Object[] args, CultureInfo culture, Object[] activationAttributes)
   at Castle.Core.Internal.ReflectionUtil.Instantiate[TBase](Type subtypeofTBase, Object[] ctorArgs)
   --- End of inner exception stack trace ---
   at Castle.Core.Internal.ReflectionUtil.Instantiate[TBase](Type subtypeofTBase, Object[] ctorArgs)
   at Castle.Core.Internal.ReflectionUtil.CreateInstance[TBase](Type subtypeofTBase, Object[] ctorArgs)
   at Castle.MicroKernel.ComponentActivator.DefaultComponentActivator.CreateInstanceCore(ConstructorCandidate constructor, Object[] arguments, Type implType)
   --- End of inner exception stack trace ---
   at Castle.MicroKernel.ComponentActivator.DefaultComponentActivator.CreateInstanceCore(ConstructorCandidate constructor, Object[] arguments, Type implType)
   at Castle.MicroKernel.ComponentActivator.DefaultComponentActivator.CreateInstance(CreationContext context, ConstructorCandidate constructor, Object[] arguments)
   at Castle.MicroKernel.ComponentActivator.DefaultComponentActivator.Instantiate(CreationContext context)
   at Castle.MicroKernel.ComponentActivator.DefaultComponentActivator.InternalCreate(CreationContext context)
   at Castle.MicroKernel.ComponentActivator.AbstractComponentActivator.Create(CreationContext context, Burden burden)
   at Castle.MicroKernel.Lifestyle.AbstractLifestyleManager.CreateInstance(CreationContext context, Boolean trackedExternally)
   at Castle.MicroKernel.Lifestyle.SingletonLifestyleManager.Resolve(CreationContext context, IReleasePolicy releasePolicy)
   at Castle.MicroKernel.Handlers.DefaultHandler.ResolveCore(CreationContext context, Boolean requiresDecommission, Boolean instanceRequired, Burden& burden)
   at Castle.MicroKernel.Handlers.DefaultHandler.Resolve(CreationContext context, Boolean instanceRequired)
   at Castle.MicroKernel.Handlers.AbstractHandler.Resolve(CreationContext context)
   at Castle.MicroKernel.DefaultKernel.ResolveComponent(IHandler handler, Type service, Arguments additionalArguments, IReleasePolicy policy, Boolean ignoreParentContext)
   at Castle.MicroKernel.DefaultKernel.Castle.MicroKernel.IKernelInternal.Resolve(Type service, Arguments arguments, IReleasePolicy policy, Boolean ignoreParentContext)
   at Castle.MicroKernel.DefaultKernel.Resolve(Type service, Arguments arguments)
   at Castle.Windsor.WindsorContainer.Resolve(Type service)
   at Castle.Windsor.MsDependencyInjection.ScopedWindsorServiceProvider.ResolveInstanceOrNull(Type serviceType, Boolean isOptional)
   at Castle.Windsor.MsDependencyInjection.ScopedWindsorServiceProvider.GetServiceInternal(Type serviceType, Boolean isOptional)
   at Castle.Windsor.MsDependencyInjection.ScopedWindsorServiceProvider.GetRequiredService(Type serviceType)
   at Microsoft.Extensions.DependencyInjection.ServiceProviderServiceExtensions.GetRequiredService(IServiceProvider provider, Type serviceType)
   at Microsoft.Extensions.DependencyInjection.ServiceProviderServiceExtensions.GetRequiredService[T](IServiceProvider provider)
   at Microsoft.AspNetCore.Hosting.WebHost.EnsureServer()
   at Microsoft.AspNetCore.Hosting.WebHost.BuildApplication()
crit: Microsoft.AspNetCore.Hosting.WebHost[6]
      Application startup exception
Castle.MicroKernel.ComponentActivator.ComponentActivatorException: ComponentActivator: could not instantiate Microsoft.AspNetCore.Server.IIS.Core.IISHttpServer
 ---> System.Exception: Could not instantiate Microsoft.AspNetCore.Server.IIS.Core.IISHttpServer.
 ---> System.Reflection.TargetInvocationException: Exception has been thrown by the target of an invocation.
 ---> System.NullReferenceException: Object reference not set to an instance of an object.
   at Microsoft.AspNetCore.Hosting.WebHostBuilderIISExtensions.<>c__DisplayClass0_0.<UseIIS>b__2(IISServerOptions options)
   at Microsoft.Extensions.Options.ConfigureNamedOptions`1.Configure(String name, TOptions options)
   at Microsoft.Extensions.Options.OptionsFactory`1.Create(String name)
   at Microsoft.Extensions.Options.OptionsManager`1.<>c__DisplayClass5_0.<Get>b__0()
   at System.Lazy`1.ViaFactory(LazyThreadSafetyMode mode)
   at System.Lazy`1.ExecutionAndPublication(LazyHelper executionAndPublication, Boolean useDefaultConstructor)
   at System.Lazy`1.CreateValue()
   at System.Lazy`1.get_Value()
   at Microsoft.Extensions.Options.OptionsCache`1.GetOrAdd(String name, Func`1 createOptions)
   at Microsoft.Extensions.Options.OptionsManager`1.Get(String name)
   at Microsoft.Extensions.Options.OptionsManager`1.get_Value()
   at Microsoft.AspNetCore.Server.IIS.Core.IISHttpServer..ctor(IISNativeApplication nativeApplication, IHostApplicationLifetime applicationLifetime, IAuthenticationSchemeProvider authentication, IOptions`1 options, ILogger`1 logger)
   --- End of inner exception stack trace ---
   at System.RuntimeMethodHandle.InvokeMethod(Object target, Object[] arguments, Signature sig, Boolean constructor, Boolean wrapExceptions)
   at System.Reflection.RuntimeConstructorInfo.Invoke(BindingFlags invokeAttr, Binder binder, Object[] parameters, CultureInfo culture)
   at System.RuntimeType.CreateInstanceImpl(BindingFlags bindingAttr, Binder binder, Object[] args, CultureInfo culture)
   at System.Activator.CreateInstance(Type type, BindingFlags bindingAttr, Binder binder, Object[] args, CultureInfo culture, Object[] activationAttributes)
   at Castle.Core.Internal.ReflectionUtil.Instantiate[TBase](Type subtypeofTBase, Object[] ctorArgs)
   --- End of inner exception stack trace ---
   at Castle.Core.Internal.ReflectionUtil.Instantiate[TBase](Type subtypeofTBase, Object[] ctorArgs)
   at Castle.Core.Internal.ReflectionUtil.CreateInstance[TBase](Type subtypeofTBase, Object[] ctorArgs)
   at Castle.MicroKernel.ComponentActivator.DefaultComponentActivator.CreateInstanceCore(ConstructorCandidate constructor, Object[] arguments, Type implType)
   --- End of inner exception stack trace ---
   at Castle.MicroKernel.ComponentActivator.DefaultComponentActivator.CreateInstanceCore(ConstructorCandidate constructor, Object[] arguments, Type implType)
   at Castle.MicroKernel.ComponentActivator.DefaultComponentActivator.CreateInstance(CreationContext context, ConstructorCandidate constructor, Object[] arguments)
   at Castle.MicroKernel.ComponentActivator.DefaultComponentActivator.Instantiate(CreationContext context)
   at Castle.MicroKernel.ComponentActivator.DefaultComponentActivator.InternalCreate(CreationContext context)
   at Castle.MicroKernel.ComponentActivator.AbstractComponentActivator.Create(CreationContext context, Burden burden)
   at Castle.MicroKernel.Lifestyle.AbstractLifestyleManager.CreateInstance(CreationContext context, Boolean trackedExternally)
   at Castle.MicroKernel.Lifestyle.SingletonLifestyleManager.Resolve(CreationContext context, IReleasePolicy releasePolicy)
   at Castle.MicroKernel.Handlers.DefaultHandler.ResolveCore(CreationContext context, Boolean requiresDecommission, Boolean instanceRequired, Burden& burden)
   at Castle.MicroKernel.Handlers.DefaultHandler.Resolve(CreationContext context, Boolean instanceRequired)
   at Castle.MicroKernel.Handlers.AbstractHandler.Resolve(CreationContext context)
   at Castle.MicroKernel.DefaultKernel.ResolveComponent(IHandler handler, Type service, Arguments additionalArguments, IReleasePolicy policy, Boolean ignoreParentContext)
   at Castle.MicroKernel.DefaultKernel.Castle.MicroKernel.IKernelInternal.Resolve(Type service, Arguments arguments, IReleasePolicy policy, Boolean ignoreParentContext)
   at Castle.MicroKernel.DefaultKernel.Resolve(Type service, Arguments arguments)
   at Castle.Windsor.WindsorContainer.Resolve(Type service)
   at Castle.Windsor.MsDependencyInjection.ScopedWindsorServiceProvider.ResolveInstanceOrNull(Type serviceType, Boolean isOptional)
   at Castle.Windsor.MsDependencyInjection.ScopedWindsorServiceProvider.GetServiceInternal(Type serviceType, Boolean isOptional)
   at Castle.Windsor.MsDependencyInjection.ScopedWindsorServiceProvider.GetRequiredService(Type serviceType)
   at Microsoft.Extensions.DependencyInjection.ServiceProviderServiceExtensions.GetRequiredService(IServiceProvider provider, Type serviceType)
   at Microsoft.Extensions.DependencyInjection.ServiceProviderServiceExtensions.GetRequiredService[T](IServiceProvider provider)
   at Microsoft.AspNetCore.Hosting.WebHost.EnsureServer()
   at Microsoft.AspNetCore.Hosting.WebHost.BuildApplication()

[toanml]

@ismcagdas please only run project angular, I haven't knew why throw that exception yet.

[clavamantock]

Hi @ismcagdas, my issue is more to do with importing the abp namespace found in "abp-web-resources/Abp/Framework/scripts/abp.d.ts" which is in the npm package "abp-web-resources" and not in abp-ng2-module. So I don't think this will help me.

same problem, just create clean angular 9 project, add abp-ng2-module, abp-web-resources, add in angular.json scripts

"node_modules/abp-web-resources/Abp/Framework/scripts/abp.js",
"node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.jquery.js",
....

first it will not resolve abp namespace, example if you are using
abp.ajax or abp.clock etc.. then you add typings.d.ts in src with reference
///<reference path="../node_modules/abp-web-resources/Abp/Framework/scripts/abp.d.ts"/> ///<reference path="../node_modules/abp-web-resources/Abp/Framework/scripts/libs/abp.jquery.d.ts"/>
......
then it will resolve, but when you build it will go back to node module reporting

///<reference types="abp-web-resources" /> node_modules/abp-ng2-module/lib/services/utils/utils.service.d.ts:1:23 - error TS2688: Cannot find type definition file for 'abp-web-resources'. ///<reference types="abp-web-resources" /> node_modules/abp-ng2-module/lib/services/abp-user-configuration.service.d.ts:1:23 - error TS2688: Cannot find type definition file for 'abp-web-resources'.

so if someone did manage to set up with angular 9 latest abp-ng2-module 6.0 with abp-web-resources successfully please share.

This worked for me to resolve

Add the following to your typeRoots in tsconfig.json
"typeRoots": ["./types",
...
],

create a ./types folder in same folder as tsconfig.json
Add a abp-web-resources folder and included an empty index.d.ts
Folder structure should look like

• types/
  -- abp-web-resources/
  --- index.d.ts

[KevinBassaDevelopment]

Oh, unfortunate this got moved from yesterdays 5.6 release to the next one, I finally wanted to switch to IVY.
Hopefully 30.April will work :)

[ismcagdas]

Waiting for https://github.com/aspnetboilerplate/aspnetboilerplate/issues/5452

[ismcagdas]

Resolved via https://github.com/aspnetboilerplate/module-zero-core-template/commit/c50d2442e7795ec8788ef72bf778b9a2ce26f054

[ikliapchuk]

"skipLibCheck": true

that's the solution?

[ismcagdas]

@ikliapchuk not just that. You also need to update abp-ng2-module to 6.0.

[HardikMasalawala88]

How can I upgrade Angular 8 version to latest version in aspnetboilerplate?
I want something like if we have new version then we can easily update using any command
Current version detail

[ismcagdas]

@PrinceMasalawala I suggest you to use https://update.angular.io/. Also update all NPM packages to their latest version. IF you face any problem, please create a new issue and we will try to help you.