Thanks for a great vite plugin. 👏
When using cesium.js in a lazy loaded JavaScript bundle, cesium({ rebuildCesium: true }) works well since
|
if (isBuild && !rebuildCesium) { |
|
tags.push({ |
|
tag: 'script', |
|
attrs: { |
|
src: normalizePath(path.join(CESIUM_BASE_URL, 'Cesium.js')), |
|
} |
|
}); |
|
} |
ensures the
<script...> tag is not included in the
index.html, and therefore also
cesium.js (which is quite large in size) is not loaded when visiting the main entrypoint of the application.
I think it would be beneficial to also have the plugin option to not inject the stylesheet link, i.e.
|
transformIndexHtml() { |
|
const tags: HtmlTagDescriptor[] = [ |
|
{ |
|
tag: 'link', |
|
attrs: { |
|
rel: 'stylesheet', |
|
href: normalizePath(path.join(CESIUM_BASE_URL, 'Widgets/widgets.css')), |
|
} |
|
} |
Use case arguments:
- When lazy loading
cesium.js, it would be nice to also lazy load the associated cesium CSS file, which is quite large (30 kB) and unhashed (i.e. can't be cached safely). For projects who want to lazy load the .css this is easily accomplished by importing the css as well
import "cesium/Build/Cesium/Widgets/widgets.css";
in the source code where import * as Cesium from "cesium"; is already imported (maybe adding this assoicated css import can even be done automatically by the vite plugin when rebuildCesium: true, before vite/rollup do their bundling?). The required cesium .css then goes through all the vite machinery for minimizing/lazy-chunking it...
- ...which then also puts it into a hashed file, which ensures the cesium css can also be strongly cached, instead of having to load it every time (without hash you would have problems when updating cesium later).
Current "workaround" is to remove the injected <link rel="stylesheet" href="/cesium/Widgets/widgets.css"> line in the generated index.html, and instead ensure the .css is added to the vite generated .css bundle by adding import "cesium/Build/Cesium/Widgets/widgets.css";
Thanks for a great vite plugin. 👏
When using
cesium.jsin a lazy loaded JavaScript bundle,cesium({ rebuildCesium: true })works well sincevite-plugin-cesium/src/index.ts
Lines 110 to 117 in 3eefe02
<script...>tag is not included in theindex.html, and therefore alsocesium.js(which is quite large in size) is not loaded when visiting the main entrypoint of the application.I think it would be beneficial to also have the plugin option to not inject the stylesheet link, i.e.
vite-plugin-cesium/src/index.ts
Lines 100 to 108 in 3eefe02
Use case arguments:
cesium.js, it would be nice to also lazy load the associated cesium CSS file, which is quite large (30 kB) and unhashed (i.e. can't be cached safely). For projects who want to lazy load the .css this is easily accomplished by importing the css as wellimport * as Cesium from "cesium";is already imported (maybe adding this assoicated css import can even be done automatically by the vite plugin whenrebuildCesium: true, before vite/rollup do their bundling?). The required cesium.cssthen goes through all the vite machinery for minimizing/lazy-chunking it...Current "workaround" is to remove the injected
<link rel="stylesheet" href="/cesium/Widgets/widgets.css">line in the generatedindex.html, and instead ensure the.cssis added to the vite generated.cssbundle by addingimport "cesium/Build/Cesium/Widgets/widgets.css";