App first launch failure

[andygup]

Not sure why but when I first ran npm start I got the following errors. But, after I reloaded the app manually in the browser everything worked okay after that.

I'm just documenting it here in case anyone else has the same issue.

app/esri-scene-view.component.ts(30,13): error TS2345: Argument of type '{ container: any; map: any; zoom: number; center: number[]; rotation: number; }' is not assignable to parameter of type 'SceneViewProperties'.
[0]   Object literal may only specify known properties, and 'rotation' does not exist in type 'SceneViewProperties'.
[0] app/geometry-engine-showcase.component.ts(95,36): error TS2339: Property 'bufferDistance' does not exist on type '{ [key: string]: AbstractControl; }'.
[0] app/geometry-engine-showcase.component.ts(104,36): error TS2339: Property 'bufferDistance' does not exist on type '{ [key: string]: AbstractControl; }'.
[0] app/geometry-engine-showcase.component.ts(166,46): error TS2345: Argument of type '{ color: number[]; outline: any; }' is not assignable to parameter of type 'SimpleFillSymbolProperties'.
[0]   Types of property 'color' are incompatible.
[0]     Type 'number[]' is not assignable to type 'Color'.
[0] app/geometry-engine-showcase.component.ts(168,51): error TS2345: Argument of type '{ color: number[]; width: number; }' is not assignable to parameter of type 'SimpleLineSymbolProperties'.
[0]   Types of property 'color' are incompatible.
[0]     Type 'number[]' is not assignable to type 'Color'.
[0]       Property 'a' is missing in type 'number[]'.
[0] app/geometry-engine-showcase.component.ts(189,50): error TS2345: Argument of type '{ color: number[]; outline: any; }' is not assignable to parameter of type 'SimpleFillSymbolProperties'.
[0]   Types of property 'color' are incompatible.
[0]     Type 'number[]' is not assignable to type 'Color'.
[0] app/geometry-engine-showcase.component.ts(191,55): error TS2345: Argument of type '{ color: number[]; width: number; }' is not assignable to parameter of type 'SimpleLineSymbolProperties'.
[0]   Types of property 'color' are incompatible.
[0]     Type 'number[]' is not assignable to type 'Color'.
[0] app/map.service.ts(20,28): error TS2345: Argument of type '{ basemap: string; layers: (FeatureLayer | GraphicsLayer)[]; }' is not assignable to parameter of type 'MapProperties'.
[0]   Types of property 'layers' are incompatible.
[0]     Type '(FeatureLayer | GraphicsLayer)[]' is not assignable to type 'Collection'.
[0]       Property 'add' is missing in type '(FeatureLayer | GraphicsLayer)[]'.

[Kunal1985]

I am getting the same issue and cannot proceed since i am using "ng build && node server.js" Since this error is present, "ng build" itself fails and cannot serve "node server.js"

[andygup]

@Kunal1985 after taking a second look at my stack trace above, if you are having similar errors it looks like TypeScript definition mis-matching within certain Class constructors. I'll check with our TS guys and report back.

[andygup]

@Kunal1985 reference: https://github.com/Esri/jsapi-resources/issues/77#issuecomment-312085747.

I was able to make the following quick/rough changes and got the app running. It had a few other minor TypeScript errors that didn't seem to affect the compiler. Hopefully between the comment reference and my snippets below you can get it going. We'll take a closer look at updating the repo and giving it a more thorough vetting on this issue.

With the Synced 3D Views sample try making the following changes in geometry-engine-showcase.component.ts:

            // STEP 1.B
            // create a graphic to display the new unioned buffer geometry
            var bufferGraphic = new Graphic({
                geometry: bufferGeometry,
                symbol: new SimpleFillSymbol({
                    color: [227, 139, 79, 0.7] as any as __esri.Color,
                    outline: new SimpleLineSymbol({
                        color: [255, 255, 255] as any as __esri.Color,
                        width: 1
                    })
                })
            });

                // STEP 2.B
                // create a graphic to display the new convex hull geometry
                var convexHullGraphic = new Graphic({
                    geometry: convexHullGeometry,
                    symbol: new SimpleFillSymbol({
                        color: [255, 255, 255, 0] as any as __esri.Color,
                        outline: new SimpleLineSymbol({
                            color: [255, 255, 255] as any as __esri.Color,
                            width: 2
                        })
                    })
                });

And for the Geometry Engine sample in map.service.ts try the following changes:

@Injectable()
export class AnalysisMapService {
    map: any = null;
    constructor() {
        this.map = new Map({
            basemap: 'dark-gray',
            layers: [
                new GraphicsLayer({
                    id: 'analysisLayer'
                }),
                new FeatureLayer({
                    url: 'http://services.arcgis.com/BG6nSlhZSAWtExvp/arcgis/rest/services/World_Volcanoes/FeatureServer/0',
                    id: 'volcanoesLayer'
                })
            ] as any as Collection
        });
    }
}