Using ESRI Javascript 4.0 API with Require JS

Question

I am running into some issues when switching my application from the Beta 3 version of the 4.0 ArcGIS Javascript API to the new release of the 4.0 Javascript API.

I had a working map when using the beta3 version of the 4.0 javascript API and had configured Require JS to load the modules correctly with the beta 3 version like this

 requirejs.config({
    baseUrl: "/App/",
    paths: {
        "text": "/Scripts/text",
        "moment": "/Scripts/moment",
        "durandal": "/Scripts/durandal",
        "plugins": "/Scripts/durandal/plugins",
        "transitions": "/Scripts/durandal/transitions",
        "esri": "//js.arcgis.com/4.0beta3/esri",
        "dojo": "//js.arcgis.com/4.0beta3/dojo",
        "dojox": "//js.arcgis.com/4.0beta3/dojox",
        "dijit": "//js.arcgis.com/4.0beta3/dijit",
    },
});

However once i switch from 4.0beta3 to just 4.0

requirejs.config({
    baseUrl: "/App/",
    paths: {
        "text": "/Scripts/text",
        "moment": "/Scripts/moment",
        "durandal": "/Scripts/durandal",
        "plugins": "/Scripts/durandal/plugins",
        "transitions": "/Scripts/durandal/transitions",
        "esri": "//js.arcgis.com/4.0/esri",
        "dojo": "//js.arcgis.com/4.0/dojo",
        "dojox": "//js.arcgis.com/4.0/dojox",
        "dijit": "//js.arcgis.com/4.0/dijit",
    },
});

I get an error while trying to load the map where it is trying to load this script and it gives a 404

http://localhost:17654/Scripts/moment/moment.js 

I believe it is attempting to load this script because the ESRI Api uses its own moment plugin and since i've already defined what moment is, its attempting to look at localhost instead of loading the esri module.

I've tried a few different configurations with require and with this i can get the page to load with no javascript errors however no map shows up

requirejs.config({
    baseUrl: "/App/",
    paths: {
        "text": "/Scripts/text",
        "moment": "/Scripts/moment",
        "durandal": "/Scripts/durandal",
        "plugins": "/Scripts/durandal/plugins",
        "transitions": "/Scripts/durandal/transitions",
        "esri": "//js.arcgis.com/4.0/esri",
        "dojo": "//js.arcgis.com/4.0/dojo",
        "dojox": "//js.arcgis.com/4.0/dojox",
        "dijit": "//js.arcgis.com/4.0/dijit",
    },
    map: {
        "*": {
            "moment/moment": "moment"
        }
    }
});

I know the javascript API uses its own version of dojo which is supposed to handle the module loading so mixing it in with require js might not even be possible but since it was working fine with the beta3 i'm hoping to find a way to get this moment plugin to load properly and have the map work using require js.

Does anyone have any experience with getting these two to work together? Any help is much appreciated. Thanks

Answer 1

It should be able to work with requirejs, however is there a particular reason you are using it instead of esri's AMD loader that comes down with their API? Using theirs should make things generally easier but you will probably run into the same issues using their loader since esri has already defined the package/alias for moment. One thing you may be able to try is naming it differently for your paths. Something like this:

requirejs.config({
  baseUrl: "/App/",
  paths: {
    "text": "/Scripts/text",
    "local-moment": "/Scripts/moment",
    "durandal": "/Scripts/durandal",
    "plugins": "/Scripts/durandal/plugins",
    "transitions": "/Scripts/durandal/transitions",
    "esri": "//js.arcgis.com/4.0/esri",
    "dojo": "//js.arcgis.com/4.0/dojo",
    "dojox": "//js.arcgis.com/4.0/dojox",
    "dijit": "//js.arcgis.com/4.0/dijit",
  },
});

This way esri can still require their moment and you could require your local-moment.