How-to import Cesium on Webpack

I’m trying to install Cesium on Webpack, and the current tutorial looks outdated.

If I do what is inside your tutorial, i get :

import Cesium from 'cesium/Cesium'
export default class CesiumAdapter extends React.Component {
  /**
   * Lifecycle method: component did mount. Used here to load and initialize the Cesium component
   */
  componentDidMount = () => {
    var viewer = new Cesium.Viewer('cesiumContainer', {
      baseLayerPicker : false
    });
  }
  render() {
    return (
      <div
        id="cesiumContainer"
      />)
  }
}

Which makes this error :

WARNING in ./web_modules/utils/cesium-adapter/src/adapters/CesiumAdapter.jsx 37:23-29
"export 'default' (imported as 'Cesium') was not found in 'cesium/Cesium'
 @ ./web_modules/utils/cesium-adapter/src/main.js
 @ ./src/CesiumTest.jsx
 @ ./src/main.jsx

WARNING in ./web_modules/utils/cesium-adapter/src/adapters/CesiumAdapter.jsx 40:27-33
"export 'default' (imported as 'Cesium') was not found in 'cesium/Cesium'
 @ ./web_modules/utils/cesium-adapter/src/main.js
 @ ./src/CesiumTest.jsx
 @ ./src/main.jsx
ℹ ｢wdm｣: Compiled with warnings.

I can fix it by importing everything like that :

import * as Cesium from 'cesium/Cesium'
 [... ]
    var viewer = new Cesium.Viewer('cesiumContainer', {
      baseLayerPicker : false
    });

Or even better (may use Webpack dead code optimizer) :

import { Viewer } from 'cesium/Cesium'
 [... ]
    var viewer = new Viewer('cesiumContainer', {
      baseLayerPicker : false
    });

[thw0rted]

That makes sense. Your fix is another good solution, though in my case it’s a bit of a pain to modify the installed library like that. I’m hoping that Cesium is willing to re-open the issue and take a PR fixing package.json for everybody.

[TJKoury]

…or you can just forget all that mess and use c137.js!