react 地图发布 cesium 篇

上篇文章介绍了如何搭建 react cesium 开发环境。在开发环境下，项目一切运行正常。最近把项目打包发布出来，却碰见了 cesium 不能正确初始化。打开浏览器的调试面板，出现好多 404，资源路径错误。下面是项目的资源处理过程整理，其中 cesium 须要独立处理，你们之后要注意。

1、react 静态资源处理

修改 config/paths.js

function getServedPath(appPackageJson) {
  ...
  const servedUrl = envPublicUrl || (publicUrl ? url.parse(publicUrl).pathname : "./");
  ...
}
复制代码

2、cesium 资源处理

这个是重点，若是不处理，项目构建后会没法正常运行，cesium 资源会报 404 错误。主要思路是，在加载 cesium 以前设置 cesium 资源的 baseUrl，调用 cesium 自带的 buildModuleUrl 函数来设置 baseUrl。

修改 /src/index.js，增长以下代码

...
import buildModuleUrl from "cesium/Core/buildModuleUrl";

buildModuleUrl.setBaseUrl("./");
...
复制代码

3、关闭 cesium 的一些警告信息

修改 config/webpack.config.js

module.exports = function(webpackEnv) {
  return {
    module: {
      unknownContextCritical: false
    }
  };
};
复制代码

4、关闭 sourceMap

修改 package.json

"scripts": {
    "build": "cross-env GENERATE_SOURCEMAP=false node scripts/build.js"
}
复制代码

以上是发布环境的所有增量配置，如何您是新建项目，请先配置开发环境，再按照上面的步骤配置发布环境。