Needed recommendations for upgrade of website to ArcGIS JavaScript 4.*

[ekleiman22]

I have a web site that uses  ArcGIS JavaScript 3.36. There are many modules based on this library and on dojo and dijit. For example, in main page index.html there is such part

require(["dojo/parser",
         "dojo/window",
         "dojo/on",
         "mapaSimple/MapSettings",
         "mapaSimple/BaseMapsMenuFacade",
         "mapaSimple/SearchMenuFacade",

and in module SearchMenuFacade.js I use

define([
"dojo/_base/declare",
"dijit/form/Button",
"mapaSimple/SearchMenuBuilder",
"mapaSimple/SearchMenuDialogRender",
"mapaSimple/SearchMenuActivity",
"dojo/i18n!mapa/nls/Resources"
],
function(
declare,
Button,
SearchMenuBuilder,
SearchMenuDialogRender,
SearchMenuActivity,
Resources          
        ) {
        return declare(null, {
            map: null,            
            menuButton: null,
            setPointPosition: null,                
        
        constructor: function(map) {            
            this.map = map;                                   
        },          
       
        createMenuButton: function() {                       
            var searchMenuBuilder = new SearchMenuBuilder(this.map);                
              
            var searchMenuDialogRender = new SearchMenuDialogRender();
            this.menuButton = new Button({
                  class: "menuButton menuSearchButton",
                  iconClass: "menuSearchIcon",
                  label: Resources.menu.search.button            
                 , onClick: function () {
                     searchMenuDialogRender.dialog.opened = true;
                     dojo.style(searchMenuDialogRender.dialog.domNode, 'visibility', 'hidden');
                     searchMenuDialogRender.dialog.show().then(function () {
                         dojo.style(searchMenuDialogRender.dialog.domNode, 'top', '100px');
                         if (getCurrentLanguage() != "en")
                             dojo.style(searchMenuDialogRender.dialog.domNode, 'right', '230px');
                         else
                             dojo.style(searchMenuDialogRender.dialog.domNode, 'left', '50px');
                         dojo.style(searchMenuDialogRender.dialog.domNode, 'visibility', 'visible');
                     });;

                 }
             }, "menuSearchButton");

and so on. Here SearchMenuBuilder and others are different modules that also use dojo objects, "menuSearchButton" is html tag in index.html.  In index.html is link to the library:

 <script src="https://js.arcgis.com/4.28/"></script>

and also 

var dojoConfig = {
            paths: { mapaSimple: location.pathname.replace(/\/[^/]+$/, "") + tail }
        };

But when I browse the page I see  many errors showing that dojo objects not found. How this could be fixed?

[JeffreyThompson2]

The 4.X version of the API has been completely rewritten from the 3.X version. Most, if not all, of the Dojo components have been removed by now and complete removal of Dojo is a stated goal of the Dev team. You will probably be better off starting over from scratch than trying to convert your current code.

[BlakeTerhune]

Esri has some documentation about migrating an app from 3.x to 4.x that might be worth reading through.

Migrating from 3.x to 4.28 | Overview | ArcGIS Maps SDK for JavaScript 4.28 | ArcGIS Developers

There's also a functionality matrix that will help you locate comparable features.

[ekleiman22]

Thank you. I saw this page. But their description is not complete. For example, there is no "dijit/form/Button", "dijit/Dialog" and other things. I tried  simple example:

require([
  "esri/widgets/Button" 
], function (Button ) {

and I get

4.28/:31 Error: scriptError: https://js.arcgis.com/4.28/esri/widgets/form/Button.js

because such URL does not exist. It seems that Button and some other  widgets from old version  are not included into new widgets library. At least I do not see them here esri widgets . Is there any possibility to use old dijit library in new web site based on ArcGIS JavaScript version 4.*?

[ekleiman22]

Thank you, JeffreyThompson2. Could you recommend what controls to use instead of dijit/Button, dijit/Dialog, dijit/form/CheckBox, dijit/form/TextBox, dijit/form/RadioButton,  dijit/registry ?

[JeffreyThompson2]

I never used the 3.X API, but you will probably find what you need in the Calcite components library.