win10在vuecli4中安装cesium并创建项目

1.安装node.js和vue/cli

2.安装cesium
cesium是一个开源的世界级三维地理JavaScript库，它具有性能优异、精度高、可视化效果好和容易上手等特点，来自航空、智慧城市和无人机等各行业的开发者都在使用cesium来创建可交互的互联网应用，分享动态的地理数据
npm install --save cesium --registry=https://registry.npm.taobao.org

3.安装vs code和vs code插件
安装VS Code插件：ESLint、Prettier - Code formatter、Vetur、Path Intellisense

4.vscode打开上一篇文章(https://developer.aliyun.com/article/765620)创建的test项目文件夹

**5.在test项目根目录创建vue.config.js.输入以下内容并保存为vue.config.js

module.exports = {
  configureWebpack: {
    module: {
      unknownContextCritical: false
    }
  },
  chainWebpack: config => {
    config
      .plugin('define').tap(args => {
        args[0].CESIUM_BASE_URL = JSON.stringify('./')
        return args
      })
  }
}

6.在test项目的src文件夹下修改App.vue.内容如下

<template>
  <div id="app">
    <CesiumViewer />
  </div>
</template>

<script>
import CesiumViewer from './components/CesiumViewer.vue'

export default {
  name: 'App',
  components: {
    CesiumViewer
  }
}
</script>

<style>

</style>

7.在components下新建CesiumViewer.vue

<template>
<div id="cesiumContainer"></div>
</template>

<script>
import { Viewer } from 'cesium/Source/Cesium'
import buildModuleUrl from 'cesium/Source/Core/buildModuleUrl'
import 'cesium/Source/Widgets/widgets.css'

export default {
  name: 'CesiumViewer',
  mounted: function () {
    buildModuleUrl.setBaseUrl('static/')
    this.viewer = new Viewer('cesiumContainer')
  },
  data () {
    return {
      viewer: {}
    }
  }
}
</script>

<style scoped>
</style>

8.运行项目(原文图形界面可以显示地球.我运行时无法显示地球)
vs code下npm run serve