uniappH5和小程序动态导入模块的方法

Posted 2023-04-07 TA远方

做uniapp项目通常都是用import Module from "./../module.js"方式引用模块的，但是，这种方式是静态的，还是只能放在执行代码段的顶部（或者外部），若想放在代码中执行，那就会报错的，来看看如何解决吧。

各平台支持差异

方法名	H5	微信小程序
import()	√	×
require()	×	√

现在知道，H5项目可以用import().then()动态引入模块，而微信小程序就用require()动态导入。

在导入模块前，模块文件里的定义方式是这样的，代码如下

const template1 = ;
//...
export default 
	template1 

考虑到两个不同平台，就改成按条件编译，
例如，导入static文件夹里模块的方法实现，代码如下

importJsModuleFile(filename)
	return new Promise((resolve,reject)=>
		// #ifdef H5
		import(`./../static/$filename`).then(m=>resolve(m.default || m)).catch(reject);
		// #endif
		
		// #ifdef MP-WEIXIN
		try
			const m = require(`./../static/$filename`);
			resolve(m.default || m);
		catch(err)
			reject(err)
		
		// #endif
	);

如果require()引入模块报错 Cannot read property 'join' of null，
疑是可能是文件相对路径填错了

编译微信小程序时，注意还要关闭依赖分析，
要关闭过滤无依赖，在uniapp项目里，找到配置文件manifost.json，以源码查看，"mp-weixin"这一项中 "settings" 选项添加两个属性

	//...
	ignoreDevUnusedFiles: false,
	ignoreUploadUnusedFiles: false，

参考 如何解决“Error: xxx.js 已被代码依赖分析忽略，无法被其他模块引用”报错

不知道如何使用吗? 代码如下

//动态加载模块static资源
importJsModuleFile(filename).then(resouce=>
	console.log('template1', resouce)
	//...
).catch(err=>console.error(err));

动态导入模块

 

如反射的概念，可以通过hasattr(),getattr(),setattr(),delattr()将字符串类型的方法反射为可以直接调用的方法，那么模块的调用除了正常的调用外，是否也可以将个符串格式的模块名导入到当前目录下呢？

动态导入模块的使用：

官方推荐使用版：

import importlib
aa=importlib.import_module(\'lib.aa\')　　

标准导入格式为：importlib.import_module(name,package)

 

解释器自身使用的是：

mod=__import__(\'lib.aa\')
obj=mod.aa.C()
print(obj.name)

　　

以上代码使用的目录格式和代码为：

目录结构：

aa.py的代码：

class C:

    def __init__(self):
        self.name = \'alex\'