Hi there,
I've been teaching the Maps SDK for JS for a while now, but it's been a couple years since I last did so, and boy has a lot changed! I'm used to using the require([],()=>{}) function to bring in the modules that I'll be using, and running my files locally using separate html, javascript, and css files. This seems to no longer be supported by the API reference documentation. I think if I can get a basic web map working locally with separate files, I should be good to go. Any help is much appreciated!
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<title>Intro to MapView - Create a 2D map | Sample | ArcGIS Maps SDK for JavaScript 4.33</title>
<!-- Load required JS SDK stylesheet, contains the CSS for various widgets and the map itself -->
<link rel="stylesheet" type="text/css" href="https://js.arcgis.com/4.33/esri/themes/light/main.css">
<!-- use a local stylesheet as well for the div containing the map -->
<link rel="stylesheet" type="text/css" href="./style.css" />
<!-- specify the JavaScript ArcGIS SDK -->
<script src="https://js.arcgis.com/4.33/"></script>
<!-- specify the local JavaScript file to load a web map into viewDiv -->
<script type="module" src="./script.js"></script>
<body>
<div id="viewDiv"></div>
</body>
</html>// Load the Map and MapView modules
// require(["esri/Map", "esri/views/MapView"], (Map, MapView) => {
const [Map, MapView] = await $arcgis.import([
"@arcgis/core/Map.js",
"@arcgis/core/views/MapView.js",
]);
const myMap = new Map({
basemap: "topo-vector",
});
const myView = new MapView({
container: "viewDiv",
map: myMap,
zoom: 4,
center: [15, 65], // longitude, latitude
});
//});