What may cause TypeError: Point is not a constructor

[DaeYoon]

Hi, I am new to esri api. I attempted to convert Point (x, y coordinates) into latitude and longitude in DMS via coordinatedFormatter. Something like below worked just fine.

<script>
    require([
      "esri/geometry/coordinateFormatter","esri/geometry/Point","esri/Graphic"
    ], function(coordinateFormatter,Point) {
      var x = -118.80657463861;
      var y = 34.0005930608889;
      
      var point = new Point(x, y);
      console.log(`@@ point ${JSON.stringify(point)}`);

      coordinateFormatter.load().then(function() {
        var latlon = coordinateFormatter.toLatitudeLongitude(point, "dms", 0);
        console.log(`translated to latitude and longitude ${JSON.stringify(latlon)}`);
      })

    });
  </script>‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

However when I tried to implement almost exact ^ logic into react + node.js environment. No matter what I tried, I was keep getting TypeError: Point is not a constructor error from console in chrome devtool. Here is the water down version of code.

import React from 'react';
import { loadModules } from 'esri-loader';

class Test extends React.Component {
  state = {     
    point: null,
    coordinateFormatter: null
  }

  componentDidMount() {
    loadModules([      
      'esri/geometry/coordinateFormatter',
      'esri/geometry/Point'
    ])
      .then(([        
        Point
      ]) => {                        
        const testPoint = new Point(-118.80657463861, 34.0005930608889);
        this.setState({          
          point: testPoint      
        });
      })
      .catch((err) => {
        console.log(err);
      });
  }‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

I tried different variations of adding properties to Point constructor but none worked out.  I am desperate to identity what  caused this error and how to rectify it.  I'd appreciate your advice.

[AnneFitz · Accepted solution]

Hi Dae,

The order that you load your modules matters. In your code above, you are loading both of the coordinateFormatter and Point modules, but only reference Point inside of the then(). That makes the code think that the local Point variable is for the coordinateFormatter module, which does not have a constructor. Inside of the then(), after loadModules, try adding a local name for coordinateFormatter first, then Point, as shown below.

 loadModules([      
      'esri/geometry/coordinateFormatter',
      'esri/geometry/Point'
    ])
      .then(([        
        coordinateFormatter, Point
      ]) => {   
         ... your code here

Hope this helps!

Thanks,

Anne

[DaeYoon]

Morning Anne,

I appreciate your time to reply back on this post. Your suggestion indeed made a difference. Thank you!