https://github.com/nshen/vite-plugin-cesium

⚡ Vite plugin for Cesium
https://github.com/nshen/vite-plugin-cesium

cesium cesium-demo cesiumjs gis vite-plugin vite-plugin-cesium

Last synced: about 2 months ago
JSON representation

⚡ Vite plugin for Cesium

• Host: GitHub
• URL: https://github.com/nshen/vite-plugin-cesium
• Owner: nshen
• License: mit
• Created: 2021-03-03T05:44:56.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2024-03-11T16:59:18.000Z (6 months ago)
• Last Synced: 2024-07-26T08:07:47.053Z (about 2 months ago)
• Topics: cesium, cesium-demo, cesiumjs, gis, vite-plugin, vite-plugin-cesium
• Language: TypeScript
• Homepage:
• Size: 69.3 KB
• Stars: 217
• Watchers: 5
• Forks: 34
• Open Issues: 9
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• fucking-awesome-vite - vite-plugin-cesium - Integration with Cesium library. (Plugins / Framework-agnostic Plugins)
• awesome-vite - vite-plugin-cesium - Integration with Cesium library. (Plugins / Framework-agnostic Plugins)

README

        
# ⚡ vite-plugin-cesium

[![npm](https://img.shields.io/npm/v/vite-plugin-cesium.svg)](https://www.npmjs.com/package/vite-plugin-cesium)

[![npm](https://img.shields.io/npm/dt/vite-plugin-cesium)](https://www.npmjs.com/package/vite-plugin-cesium)

Easily set up a [`Cesium`] project in [`Vite`].

[`cesium`]: https://github.com/CesiumGS/cesium

[`vite`]: https://github.com/vitejs/vite

**update：** if you just wanna a scaffolding by using this plugin, try a simply command `yarn create cesium`, click [create-cesium](https://www.npmjs.com/package/create-cesium) for more info.

Chinese tutorial: [中文教程](https://zhuanlan.zhihu.com/p/354856692)

## Install

```bash

npm i cesium vite-plugin-cesium vite -D

# yarn add cesium vite-plugin-cesium vite -D

```

## Usage

add this plugin to `vite.config.js`

```js

import { defineConfig } from 'vite';

import cesium from 'vite-plugin-cesium';

export default defineConfig({

  plugins: [cesium()]

});

```

add dev command to `package.json`

```json

"scripts": {

  "dev": "vite",

  "build": "vite build"

}

```

run:

`yarn dev`

## Options

**rebuildCesium**

- **Type :** `boolean`

- **Default :** `false`

Default copy min cesium file to dist. if `true` will rebuild cesium from source.

```js

import { defineConfig } from 'vite';

import cesium from 'vite-plugin-cesium';

export default defineConfig({

  plugins: [

    cesium({

      rebuildCesium: true

    })

  ]

});

```

## Demo

`src/index.js`

```js

import { Viewer } from 'cesium';

import './css/main.css';

const viewer = new Viewer('cesiumContainer');

```

> or if you like global Cesium object you can write as

```js

import * as Cesium from 'cesium';

const viewer = new Cesium.Viewer('cesiumContainer');

```

`index.html`

```html

  

    

    

    

    cesium-vite

    

  

  

    


  


```

`src/css/main.css`

```css

html,

body,

#cesiumContainer {

  width: 100%;

  height: 100%;

  margin: 0;

  padding: 0;

  overflow: hidden;

}

```

Add `dev` and `build` commands to `package.json`

```

"scripts": {

    "dev": "vite",

    "build": "vite build"

},

```

Run `yarn dev`

For full demo project please check [./demo](https://github.com/nshen/vite-plugin-cesium/tree/main/demo) folder.

##

## License

MIT