18ea3e0c8b
- 添加组件加载成功日志记录 - 在加载脚本前输出调试信息 - 更新模块导入后的日志格式 - 优化组件实例获取流程 - 改进依赖脚本加载顺序 - 增加对模块类型判断的日志输出
99 lines
2.5 KiB
JavaScript
99 lines
2.5 KiB
JavaScript
export class ScriptManager {
|
|
constructor() {
|
|
this._loadedClasses = new Map();
|
|
this.currentScriptEl = null;
|
|
this.currentModule = null;
|
|
this.currentName = null;
|
|
}
|
|
|
|
async loadScript({path, name, isModule = false, deps = []}) {
|
|
console.log('loadScript', name);
|
|
if (this._loadedClasses.has(name)) {
|
|
console.log(`Component ${name} loaded from cache`);
|
|
}
|
|
|
|
console.log('deps', deps);
|
|
for (const dep of deps) {
|
|
await this._appendScript({path: dep, isModule: false});
|
|
}
|
|
|
|
let componentReference = null;
|
|
|
|
console.log(`isModule:${isModule}`);
|
|
if (isModule) {
|
|
const module = await import(path);
|
|
this.currentModule = module;
|
|
componentReference = module;
|
|
} else {
|
|
await this._appendScript({path, isModule: false});
|
|
componentReference = window[name] || null;
|
|
}
|
|
|
|
if (componentReference) {
|
|
this._loadedClasses.set(name, componentReference);
|
|
}
|
|
|
|
this.currentName = name;
|
|
return componentReference;
|
|
}
|
|
|
|
async _appendScript({path, isModule}) {
|
|
const s = document.createElement('script');
|
|
s.src = path;
|
|
s.type = isModule ? 'module' : 'text/javascript';
|
|
s.async = false;
|
|
|
|
return new Promise((resolve, reject) => {
|
|
s.onload = () => {
|
|
this.currentScriptEl = s;
|
|
console.log(s);
|
|
resolve();
|
|
};
|
|
s.onerror = () => {
|
|
reject(new Error(`Failed to load script: ${path}`));
|
|
}
|
|
document.body.appendChild(s);
|
|
});
|
|
}
|
|
|
|
async unloadScript() {
|
|
console.log('unloadScript');
|
|
if (this.currentScriptEl) {
|
|
try {
|
|
this.currentScriptEl.remove();
|
|
} catch (e) {
|
|
console.error(e);
|
|
}
|
|
}
|
|
|
|
this.currentModule = null;
|
|
this.currentName = null;
|
|
this.currentScriptEl = null;
|
|
}
|
|
|
|
async getComponentInstance(name) {
|
|
const ComponentClassReference = this._loadedClasses.get(name);
|
|
const BaseClassForCheck = window.BaseComponent;
|
|
|
|
if (!ComponentClassReference) {
|
|
console.error('ComponentClassReference not found');
|
|
return null
|
|
}
|
|
|
|
const ComponentClass = ComponentClassReference.default
|
|
|| ComponentClassReference;
|
|
|
|
if (typeof ComponentClass === 'function') {
|
|
if (!(ComponentClass.prototype instanceof BaseClassForCheck)) {
|
|
console.error(`Component ${name} does not inherit BaseComponent.`);
|
|
return null;
|
|
}
|
|
|
|
return new ComponentClass();
|
|
}
|
|
|
|
console.error(`Component ${name} does not exist`);
|
|
return null;
|
|
}
|
|
}
|