Angular 11 Support

[rexebin]

Thank you for sharing xplat, it is awesome, I love the conventions.

I am not sure if it is only me or not. I tried a clean project following xplat's official guidance and a clean nx project without xplat. Latest Nx support Angular 11 just fine but building fails in the xplat project.

After upgrading to angular 11 in the xplat project, running nx serve xxx was failed with this error: Cannot find module '@angular-devkit/core/src/experimental/workspace'. Downgrade @angular-devkit/core to 10 would remove this error, however the builds were not incremental hence very slow and probably a lot of other problems I didn't know.

Should I wait for the xplat team add support to angular 11, if so, is there a rough time line available? Or is it only me? Is there a work around solution to fix above?

Thank you!

[NathanWalker]

Hi @rexebin thank you 🙏 -- We are updating to Angular 11 now - While at it we are making a really nice welcome change along with a migration for xplat 10 > 11. It will be landing official Nx libraries for each segment of the xplat architecture allowing it to play nicely into Nx's affected scripts, dep-graph, linting, testing, etc.

Aiming for the updates by mid next week (with hopes for sooner).

[rexebin]

Very exciting!Looking forward to the release!

[pegaltier]

Awesome but i guess you should wait to synchronize the release after NX11 as well, right? @NathanWalker

[NathanWalker]

Yes @pegaltier been keeping eye on that - ideally yes we want to see Nx11 released first.

[rexebin]

It's nice to have the latest version of NX, but I think it is generally not the best strategy to wait for a dependency to release. I would be glade to upgrade xplat as soon as possible.

[pegaltier]

@rexebin don't worry based on this video, NX11 should arrive in few days too: https://www.youtube.com/watch?v=W7b55ANw0fI

[NathanWalker]

Thanks @rexebin for offer to help there - generally if Nrwl team shows signs of updates around the corner we like to wait for their updates first - if no sign or seems like could be 4 weeks or more before updates land then makes sense to jump the gun. In this case looks like was just merged and probably will be released this week.

[pegaltier]

@NathanWalker @rexebin It's here: https://github.com/nrwl/nx/releases/tag/11.0.0

[rexebin]

Awesome! Thank you for the hard work! xplat must be near, very excited.

[NathanWalker]

Thanks all, working on the update and will have it posted most likely Wednesday eod - There's a migration I'll need to write to auto-update existing workspaces with the new and improved lib separation but I may end up releasing the update and add a migration on a patch update but we'll see.

[NathanWalker]

11.0.0 is published now.

npx create-nx-workspace@latest
npm i @nstudio/xplat -D
nx g app

To create new Nx 11 workspaces with the new xplat lib separation.

I'll keep the linked PR open until I have the migration complete which will provide a way to auto migrate existing Nx+xplat workspaces. But closing this now since angular 11 support has been published with 11.0.0 just now.

[NathanWalker]

For those looking to update existing Nx workspaces with xplat v10 to v11, we have published a release that you can run this migration - we have tested this against several large workspaces internally with great results. Please try it and let us know:

• 1. Migrate Nx first

nx migrate latest
npm install
nx migrate --run-migrations=migrations.json

• 2. Migrate xplat

nx migrate @nstudio/xplat@latest

npm install

IMPORTANT: Don't forget to run npm install at the end.

Now that the latest versions are installed, kick off the xplat architecture init to add the new xplat lib separations.

You will want to pass just the platforms which you currently use in your workspace. The prefix you use can be the same your workspace is currently configured to use. This can be found in package.json under the xplat key.

nx g @nstudio/xplat:init --prefix=abc --platforms=web,nativescript --framework=angular

With the new architecture in place, you can now kick off the xplat workspace migration:

nx migrate --run-migrations=migrations.json

This will handle a lot of laborious manual update tasks like:

• Updating your tsconfig path mappings
• Updating imports throughout all shared and app code to match the new xplat lib barrels
• Update app configurations to use the latest Nx 11 has to offer
• Update nx.json and workspace to clean out old retired references and update to new ones
• Lastly move all your shared code into the new structure

Lastly do a full clean of your workspace to ensure you're in good updated shape now:

npm run clean

We will publish a blog about this update and instructions soon but would greatly appreciate those looking to migrate existing workspaces and let us know.

[gogoout]

Hi, thanks for the awesome works. Some feedback here:

• the migration is pretty drastic, so probably should have a warning or something. So that we can prepare --- close current feature branch or something like that.
• we have a custom platform called server alone side web and that got removed during the migration.
• during the migration update-to-11-env-base, the script failed at line 188 because we have a object style entry like this

  "styles": [
                          "apps/xx/src/styles.scss",
                          {
                              "input": "apps/xx/src/scss/themes/xx.scss",
                              "lazy": true,
                              "bundleName": "theme_xx"
                          }
  ],

• the tsconfig changes removed some of our custom changes like

  "angularCompilerOptions": {
      "fullTemplateTypeCheck": true,
      "strictInjectionParameters": true
  }

Looking forward for the blog post and happy new year!

[NathanWalker]

@gogoout this is incredibly helpful thank you. We’ll work these into the migration and publish another patch to consider these early next week. Sounds like you were able to work through it but we can definitely handle those things in the migration as well.

Let us know how you like the updated Nx library structure. We’re looking at an additional checkbox you could toggle when generating a feature to have it auto split out a segregated library as an added option as well.

[gogoout]

I eventually quit the migration for now because we have several WIP branches currently. But the new structure is way more clear than before, it will also leverage the existing nx schematic much easier.

[NathanWalker]

Ok good to hear - I’ll ping back here when the migration is updated to auto handle the other cases you mentioned. If you noticed any other edge case drop mention when possible and can include in blog post that will cover it all.

[NathanWalker]

@gogoout We have published 11.0.8 which includes adjustments to migration to also handle the cases you mentioned. When you get a chance perhaps on a branch you could do a clean migration (starting with Nx, then onto xplat) and let me know if better results.

A blog post will be published this week.