cesium 1.96.0 breaks (at least vite | vite-plugin-cesium) build chains due to export from mersenne-twister.js

[meschg]

Dear cesium-team,

looks like cesium 1.96.0 might breaks some build chains - at least my vite-build is not working anymore. I got the following issue on my dev system. I did not test it yet on another system but I can reproduce the issue by updating from 1.95.0 to 1.96.0 in my update-test project and also in my main project (not public available). I added the error below:

Issue export { default } from '/node_modules/mersenne-twister/src/mersenne-twister.js?v=9f8ad086'; cesium 1.96.0 is not working with vite, vue, vite-plugin-cesium

Sandcastle example | How to reproduce

use commit: https://github.com/meschg/vue-stack-cesium/commit/8141e225e9f89a01aac8bdff077358742891f89b npm install [email protected] -f install vite/vue dep vite or use vue ui

Cause | How to fix

• Sorry, not absolutly clear to me :(
• vite-plugin-cesium might be the issue but I did not test it yet without the vite-plugin-cesium Mabye someone else can check if it also is an issue when not using vite-plugin-cesium https://github.com/nshen/vite-plugin-cesium/issues/34

Browser: Firefox 91.11.0esr (64-Bit) node v16.132 npm 8.16.0

Operating System: Debian Bookworm 2022-08-07

Most errors I had with cesium in my vue project over the last two often where pretty similar in angular, react and anything with webpack. I am not sure if this also applies here. I hope this is no duplicate and also anyone else can reproduce this.

Thanks for you effort!

Kind regards, Gerhard

[ggetz]

Hi @meschg, we did recently update our internal build process. However now we are using esbuild, which I believe is what vite uses under the hood, so it still should be possible to build Cesium with vite.

We don't maintain vite-plugin-cesium, but would suggest the configuration be updated as needed based on these recommendations. It also looks as if vite-plugin-cesium uses the built Cesium distributable, where it may be beneficial to use the Source modules directly instead if possible. Here is our esbuild configuration for reference.

As an aside, we do plan on factoring out the Source/ThirdParty directory and using imports in place. If a more specific import would fix this problem in vite-plugin-cesium, we'd be happy to review a PR.

[nshen]

Hi @ggetz, I made a pr https://github.com/CesiumGS/cesium/pull/10655, please check.

And BTW I hope cesium team can help my vite-plugin-cesium and create-cesium projects. I think they were the best and the fastest way to develop cesium-based projects before 1.96.0, and hundreds of projects are based on it.

PR is welcome, or if you are interested in officially maintaining this project please talk to me @nshen121 or email me [email protected] , thanks.

[ggetz]

Hi @nshen! Thank you for creating these two projects. We're happy to help answer any questions, and to review any PRs if needed. However, I don't think we have the bandwidth to take on maintenance for vite-plugin-cesium or create-cesium at the moment.

[an501920078]

Many people use it, including me!

[nshen]

Thanks @an501920078 , I hope it will work after Refactor "Source/ThirdParty" imports.

[ggetz]

@nshen After the fixes from https://github.com/CesiumGS/cesium/issues/10568, have you had any luck with vite-plugin-cesium?

[nshen]

I replaced cesium 1.95.0 with the one I build, seems don't work, I don't know why. @ggetz

---

code

https://github.com/nshen/vite-plugin-cesium/tree/main/demo

[ggetz]

@nshen I'm actually having trouble reproducing the error with 1.96 myself.

1. Clone vite-plugin-cesium
2. Edit package.json to use [email protected]
3. yarn install
4. cd demo
5. Edit package.json to use [email protected]
6. yarn install
7. yarn serve

[nshen]

@ggetz Thanks for trying, the error will only show when you run yarn dev with 1.96

[ggetz]

Thanks @nshen. Based on the vite docs for optimizeDeps.exclude, I was able to get everything working with the following tweak in src/index.ts:

      userConfig.optimizeDeps = {
-        exclude: ['cesium']
+       include: ['cesium > mersenne-twister']
      };

[nshen]

Oh thanks, @ggetz, I just have to remove exclude: ['cesium'] then everything gets working!

But I remembered why I exclude cesium was because while we don't exclude cesium, vite will pre bunding cesium library for page load performance.

when cesium is being bundled, it makes chrome's breakpoint jumping inside cesium very slow. because the bundled file is very very big. It prevents me from investigating the internal structure of cesium.

so I think I should not remove exclude: ['cesium'], maybe I should keep exclude cesium but include all third parties like:

userConfig.optimizeDeps = {
  exclude: ['cesium'],
  include: ['cesium > mersenne-twister', 'cesium > urijs', 'cesium > earcut', ......]
};

what do you think?

[nshen]

I just make it work first, maybe it's not a big problem, now vite-plugin-cesium 1.2.21 can works with cesium 1.96.0.

@meschg

  "devDependencies": {
    "cesium": "^1.96.0",
    "vite": "^3.0.4",
    "vite-plugin-cesium": "^1.2.21"
  }

[meschg]

Hi @ggetz and @nshen,

thanks for your effort investigating and fixing this. I can confirm that both my vite projects now work with [email protected] and [email protected].

Kind regards, meschg

[ggetz]

@nshen I'm glad this is at least working for the time being!

when cesium is being bundled, it makes chrome's breakpoint jumping inside cesium very slow. because the bundled file is very very big. It prevents me from investigating the internal structure of cesium.

Ah, good point. We've seen this before on some of our internal projects that use CesiumJS. What we've tended to do is blackbox the script when debugging. That way, developers have some flexibility if they want to step through CesiumJS or not. If that works for your use cases, perhaps you can recommend this approach in your documentation?

If not, your suggestion should work. However, I think mersenne-twister is the only third party module which needs to be included, as it is an older module which is not ESM.

[ggetz]

We can continue the discussion here, but I'm going to close the issue since no additional changes are needed in CesiumJS itself. Thanks!