vue3+vite项目 怎么通过import 获取某个文件夹下所有导出的变量
时间: 2024-01-25 18:02:17 浏览: 41
你可以使用ES6模块的动态导入(Dynamic Import)来实现导入某个文件夹下所有导出的变量,具体实现步骤如下:
1. 安装glob库,该库允许你使用通配符模式匹配文件路径。
```
npm install glob --save-dev
```
2. 在需要导入所有变量的文件中,使用glob库查找匹配的文件路径,并将其动态导入。
```javascript
import glob from 'glob';
async function importAllModules() {
let modules = {};
// 查找指定目录下所有的.js文件
const files = glob.sync('./path/to/directory/*.js');
for (const file of files) {
const module = await import(file);
// 将导出的变量添加到modules对象中
Object.assign(modules, module);
}
return modules;
}
// 使用async/await获取导出的变量
(async () => {
const allModules = await importAllModules();
console.log(allModules);
})();
```
这样就可以通过import获取某个文件夹下所有导出的变量了。需要注意的是,如果你使用的是Vue 3的话,由于Vue 3默认使用ESM模块,因此可以直接使用import导入模块,无需使用动态导入。
相关推荐
![rar](https://img-home.csdnimg.cn/images/20210720083606.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)