cesium在vue中引入报错解决；cesium在vue中初始化地球

第一步： 

npm install cesium

第二步：

找到node_modules/cesium/Build/Cesium 文件夹，把这个 Cesium 文件夹复制一份到项目的 public 文件夹下

第三步：

在public文件夹下的index.html 文件中，head 标签里面，引入 cesium 的全局样式。

<link rel="stylesheet" href="./Cesium/Widgets/widgets.css">

接着在 body标签的最后，引入 cesium 源码。

<script type="text/javascript" src="./Cesium/Cesium.js"></script>

这里就是可以初始化地球的代码， Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1N'，这里是申请一个自己的cesium的token,避免多次请求变白问题。

Cesium ion 可以登录注册一下~

<template>
  <div id="my-map"></div>
</template>

<script>
export default {
  name: "HomeView",
  methods: {
    init() {
      Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1N'
      this.viewer = new Cesium.Viewer('my-map', {
        homeButton: false,//可以回到最初的视角
        sceneModePicker: false,//地球的展示形式，球体还是平面
        baseLayerPicker: false, // 底图影像切换
        animation: false, // 是否显示动画控件
        infoBox: false, // 是否显示点击要素之后显示的信息
        selectionIndicator: false, // 要素选中框
        geocoder: false, // 是否显示地名查找控件
        timeline: false, // 是否显示时间线控件
        fullscreenButton: false,//是否显示全屏按钮
        shouldAnimate: false,//是否需要动画
        navigationHelpButton: false, // 是否显示帮助信息控件
      });
      this.viewer._cesiumWidget._creditContainer.style.display = 'none'//关闭版本提示文字
    }
  },
  mounted(){
    this.init()
  }
};
</script>

<style scoped>
#my-map {
  width: 100%;
  height: 100%;
  background-color: black;
}
</style>