Transition from CDN to Webpack 5

CesiumJS
1

Hey!

I’m trying to transition my project I built from the ground to build it with webpack 5 instead of using CDN.
I have followed this: cesium-webpack-example/webpack-5 at main · CesiumGS/cesium-webpack-example · GitHub and this CesiumJS Quickstart – Cesium .

I have managed to get a basic example working:

import {
  Viewer,
  Cartesian3,
  Math,
  Ion,
  Terrain,
  createOsmBuildingsAsync,
} from "cesium";
import "cesium/Build/Cesium/Widgets/widgets.css";
import "./css/main.css";

// Initialize the Cesium Viewer in the HTML element with the `cesiumContainer` ID.
const viewer = new Viewer('cesiumContainer', {
    terrain: Terrain.fromWorldTerrain(),
  });    
  
  
// Add Cesium OSM Buildings, a global 3D buildings layer.
const osmBuildingsTileset = await createOsmBuildingsAsync();
viewer.scene.primitives.add(osmBuildingsTileset);

// Fly the camera to San Francisco at the given longitude, latitude, and height.
viewer.camera.flyTo({
  destination: Cartesian3.fromDegrees(-122.4175, 37.655, 400),
  orientation: {
    heading: Math.toRadians(0.0),
    pitch: Math.toRadians(-15.0),
  },
});

But I can’t seem to switch to use my own ion terrain, the way I used it in my CDN project was like this:

viewer.scene.setTerrain(
    new Cesium.Terrain(Cesium.CesiumTerrainProvider.fromIonAssetId(2255008))
  );

I have a feeling it’s something basic… Can someone help me or put me in a direction how to convert my whole project (I feel it will run better with webpack and get easier to manage in the end). The app I’ve built has drawing toolbox, coordinate lookup and tracker, ability to genereate terrainprofiles, etc. I’ve built each functionallty in its own js file, and imported viewer to each file like this (where viewer.js is the main js file so to speak):

import { viewer } from "./viewer.js";

document.getElementById("terrainProfileModeBtn").addEventListener("click", function () {
  toggleTerrainProfileMode();
});

etc...

I apprichiate all help!

2

Apperentaly I missed this: import * as Cesium from 'cesium';
Now it works “:)”