craco-cesium

craco-cesium

Let's use 🌍Cesium with create-react-app today!

This is a plugin for @craco/craco.

Very very easy usage

1. Create a React project

npm -g i create-react-app # or yarn global add create-react-app
create-react-app example
cd example

2. Install modules

In your create-react-app project, install modules:

npm install --save @craco/craco craco-cesium cesium
# or
yarn add @craco/craco craco-cesium cesium

3. Rewrite npm scripts

Rewrite npm scripts in package.json as following:

{
  // ...
  "scripts": {
    "start": "craco start", // react-scripts -> craco
    "build": "craco build", // react-scripts -> craco
    "test": "craco test",   // react-scripts -> craco
    "eject": "react-scripts eject"
  },
  // ...
}

4. Create craco config file

Create craco.config.js in the proejct root:

const CracoCesiumPlugin = require("craco-cesium");

module.exports = {
  plugins: [
    {
      plugin: CracoCesiumPlugin(/* options */)
    }
  ]
};

5. Congratulations! 🎉

Set up is complete! Enjoy your Cesium life.

Resium is also recommended.

You can import Cesium as following:

import { Viewer, Entity, Color } from "cesium";

Options

If the option is omiited, the default options is used:

{
  "loadPartially": false
}

loadPartially

If false, whole Cesium will be loaded in HTML and window.Cesium is used in import { ... } from "cesium";.

If true, Cesium will be load partially and bundled in the JS. For details, refer to Cesium official tutorial.

Changelog

v0.1.0 - 2019/03/08

• First release