x
x
x
x
HTML |
---|
<div ov-include-js-files="{{PLATFORM_JS_ASSET_PATH}}/VueDashboard/assets/index.d680750c.js" ov-type="vue"> </div>
<div ov-include-js-files="{{PLATFORM_JS_ASSET_PATH}}/VueDashboard/assets/index.b75b02cc.css" ov-type="css"> </div>
<!-- <script type="module" crossorigin src="https://gsvlabs-confluence-files.s3.us-west-2.amazonaws.com/staging-files/js/LBNL/VueDashboard/assets/index.9264fc2d.js"></script> -->
<div id="LBNL"> </div>
<script>
const replaceGlobalVars = str => {
const varsToReplace = {
"{{PLATFORM_JS_ASSET_PATH}}": PLATFORM_JS_ASSET_PATH,
/*"{{VUE_APP_INDEX_JS}}": VUE_APP_INDEX_JS,
"{{VUE_APP_INDEX_CSS}}": VUE_APP_INDEX_CSS*/
}
const reg = new RegExp(Object.keys(varsToReplace).join("|", "g"));
return str.replace(reg, matched => varsToReplace[matched]);
}
async function includeJsAndCssFiles() {
const attr = "ov-include-js-files"
const bucket = ASSET_URL
const elements = $(`div[${attr}]`);
for(let i = 0; i < elements.length; i++){
const el = elements[i];
const file = replaceGlobalVars(el.getAttribute(attr));
const type = el.getAttribute("ov-type");
let newEl = null;
// handle css
if (type === "css") {
newEl = document.createElement("link");
newEl.rel = "stylesheet";
newEl.type = "text/css";
newEl.href = `${bucket}${file}`
} else {
// handle js
newEl = document.createElement('script');
newEl.type = 'text/javascript';
if(type === "vue"){
newEl.type = 'module';
newEl.crossorgin = true;
}
newEl.src = `${bucket}${file}`;
newEl.async = false;
}
el.appendChild(newEl);
el.removeAttribute(attr)
}
return;
}
includeFiles().then(() => {
includeJsAndCssFiles().then();
});
</script> |