美文网首页开源cesium
Vue 引入 Cesium 碰到的大坑

Vue 引入 Cesium 碰到的大坑

作者: RulerMike | 来源:发表于2020-10-20 18:06 被阅读0次

由于项目需要需要使用到 Vue + Cesium,过程中碰到问题花了很长时间解决,希望帮到有同样问题的朋友。

如果使用 npm 包安装和使用 Cesium 的话通常会在 vue.config.js 里配置:

configureWebpack: {
    plugins: [
      new CopyWebpackPlugin([
        {
          from: 'node_modules/cesium/Build/Cesium/Workers',
          to: 'cesium/Workers'
        }
      ]),
      new CopyWebpackPlugin([
        {
          from: 'node_modules/cesium/Build/Cesium/ThirdParty',
          to: 'cesium/ThirdParty'
        }
      ]),
      new CopyWebpackPlugin([
        { from: 'node_modules/cesium/Build/Cesium/Assets', to: 'cesium/Assets' }
      ]),
      new CopyWebpackPlugin([
        {
          from: 'node_modules/cesium/Build/Cesium/Widgets',
          to: 'cesium/Widgets'
        }
      ]),
      new webpack.DefinePlugin({
        // Define relative base path in cesium for loading assets
        CESIUM_BASE_URL: JSON.stringify('./cesium')
      })
    ],
}

这样去引入 Cesium 项目所需的依赖,资源是没有问题的,问题在于当需要用到 Cesium 变量的时候需要去引用 node_module/cesium/Source 下的 Cesium.js,用这种方式引入源码才不会在使用 Cesium 变量时出现各种各样奇怪的报错。

import * as Cesium from 'cesium/Source/Cesium'  //正确
import * as Cesium from 'cesium/Build/Cesium/Cesium' //会出现错误 

相关文章

网友评论

    本文标题:Vue 引入 Cesium 碰到的大坑

    本文链接:https://www.haomeiwen.com/subject/apndmktx.html