question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Angular 11 --prod build of `@arcgis/core` application fails to render `Legend` in an `Expand` and `FeatureLayer` symbology

See original GitHub issue

I am reporting an issue with

  • TypeScript definitions
  • [ x ] another resource in this repository

Issue

I’m using @arcgis/core 4.18.1 Beta in an Angular 11 application. It’s a simple application that I’m trying to use as the basis for a blog post about integrating ng components into the DefaultUI.

When using the development server (ng serve) or a “non-prod” build (ng build), the application works as expected. When adding the --prod flag to the ng build command, the feature layer renders, but the Legend widget fails and the symbology is not as-defined on the layer.

Replication

Here’s a repository that can be used to replicate the issue: https://github.com/vitale232/ngx-widget-post

The issue is present in both branches. To test the builds, I’m using the lite-server from npm.

npm install -g lite-server

To see how the application should look and function, run the following:

ng build
lite-server --baseDir dist/ngx-widget

image

To replicate the issue, run

ng build --prod
lite-server --baseDir dist/ngx-widget

The build runs fine, but the served output is not as expected:

image

There are some warnings present in the console: image

Secondary Issue

I’m not sure if ya’ll intend to support this, but I also tried to build this application in a stackblitz. The blitz is a bit slow to compile, but when it does, the map does not render.

https://stackblitz.com/edit/ngx-widget-esri-core

Aside from this, the ESM build has been a joy to work with. Exciting times for Esri JS devs!

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:6 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
andygupcommented, Jan 25, 2021

Thanks for reporting @vitale232! We are investigating a number of issues related to Angular production builds and the information you have provided is very helpful.

I’ll also take a look at stackblitz, not sure what’s going on there.

0reactions
andygupcommented, Feb 3, 2021

do you expect the bundle size to come down as the ESM build matures, or is it more of a WYSIWG proposition for now

We’ll continue to optimize while at the same time we are adding new functionality. It’s a balance of both.

FYI, we’re hoping to have the build error issue resolved at 4.19 (April). Since this is a known problem that we are actively working on. I’ll go ahead and close this issue. Thanks again for reporting!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Build error with @arcgis/core and Angular 11 - Esri Community
Hi @turbolego those errors seem to be showing a configuration issue in Angular and not an issue with arcgis/core. Did the app work...
Read more >
Release notes for 4.25 | ArcGIS Maps SDK for JavaScript 4.25
Web maps authored with headings and grouped symbols in prior versions of ArcGIS Pro will not display the legend properly. These maps must...
Read more >
27 Differences Between ArcGIS and QGIS - The Most Epic GIS ...
It's a head-to-head GIS software showdown with the star-studded lineup in the GIS industry- ArcGIS vs QGIS. Discover the differences between ...
Read more >
ArcGIS API for JavaScript: Building Apps with Angular [2021]
Learn about integrating the ArcGIS API for JavaScript's @ arcgis/core ES modules with Angular's robust development platform.
Read more >
Why the amount of build files increased after installing ArcGIS ...
I have installed the @arcgis/core by using npm into my Angular application. After that when i'm going to deploy the changes in to...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found