How to use npm-installed cesium for browser

Question

Cesium is now on npm. After npm install cesium-ing into my project, all codes go into node_modules.

In the cesium hello world, it includes cesium by something like <script src="your/path/to/Cesium.js"></script>

My question is, what additional steps I need to do in order to use cesium from html?

Answer 1

There are a couple of ways. If the node_modules folder itself is being served, you can just pull Cesium from there. During debugging, use the un-minified version:

<script src="node_modules/cesium/Build/CesiumUnminified/Cesium.js"></script>
<style>
    @import url(node_modules/cesium/Build/CesiumUnminified/Widgets/widgets.css);
</style>

But for production, use the minified version:

<script src="node_modules/cesium/Build/Cesium/Cesium.js"></script>
<style>
    @import url(node_modules/cesium/Build/Cesium/Widgets/widgets.css);
</style>

There's another option as well. You can use npm to pull down a copy of require.js, and then require in only the specific modules of Cesium you need, from the Cesium source tree in node_modules\cesium\Source. This results in your project including less JavaScript than pulling in the whole combined file, and allows easier debugging, because of the separate files. But it results in more network requests, so you wouldn't want this directly in a production environment without some kind of build system to combine and minify the files you use.

There's some additional detail on the blog post introducing npm cesium. (written by Matt Amato, who also provided some comments below)