layer[i].queueReprojectionCommands is not a function error (solved)

CesiumJS
1

Strangely my code work in development, but got this error in production after yarn build
I tried a knockout function to select some url of image source as SingleTileImageryProvider, such as this example in sandcastle:

In this example, user select one of the basemaps, and I modified it to select raster images by

const layer = new SingleTileImageryProvider({
          url: url,
          rectangle: rectangle, //| Rectangle.fromDegrees(-180.0, -90.0, 180.0, 90.0),
          defaultAlpha: alpha | 0.5,
          proxy : new DefaultProxy('/proxy/')
      });

then push these layers into an array of viewModel as a select input. It works well in development (npm run dev in a react app). No related errors and No warnings. Function as expected. After build, it also work to show the default image source, but when I try to select different image to show (as following figure), got this error and rendering stopped:

“An error occurred while rendering. Rendering has stopped.
TypeError: t[i].queueReprojectionCommands is not a function”

Tracking each code step in dev source map, it seems everything is fine. Google shows nothing about this error. Could anyone give me some comments or some possible ways to handle this error? Thanks.

(Function works when in dev, but stops rendering in prod when select another image)

擷取1.PNG
擷取1.PNG763×616 194 KB

2

Updated (20201027) I found a check of layer by

 layer.constructor.name === "SingleTileImageryProvider"

would fail after build (but ok in dev). So I mark and modify it, then everything work well both in dev and prod. So this problem got solved.

======================
I modify a smaller reproducible repo (on preactjs) for this problem:

The reproducible repo is https://github.com/cywhale/preact_cesium
Just clone it and npm install
develpment version is work well: (npm run dev)
After build (npm run build) and npm run serve, got the error as my problem.

The code about layer selection in a modal (icon in left-top corner on screen) is here:


Put layers into viewModel 
  const add_gbloverlay = (url, name, alpha, show, rectangle) => {
    const lay = new SingleTileImageryProvider({
...
});

Other codes are modified based on cesium sandcastle example: https://sandcastle.cesium.com/?src=Imagery%20Layers%20Manipulation.html

Any comments would be appreciated. Thanks a lot.

(Note: because I have aother problem for large bundle size on this forum Large bundle size
so I still output webpack-bundle-analyzer result in running. Please just skip it here.