导入和导出JS库

这里我定义了一组库

lib1.js

export default {
Func1() {
return ...
}
}


（其他库也是如此）

在这里，我将这些库导入到主文件中，稍后再导入到我的Vue中：

api.js（不是lib1，lib2，lib3和api在同一文件夹中）

import './lib1';
import './lib2';
import './lib3';


正在显示：

Mix给我一个错误，指出找不到函数：

"export 'Func1' (imported as 'Api') was not found in '@/api/api' ....


我知道路径是正确的，因为例如，如果我直接在我的视图中导入库，那么它将起作用：

（vue）：

这里有什么？我只希望“主”文件导入我的所有Api函数，而不是分别导入每个函数。

关于环境的其他说明：我正在使用Laraval 6和Vue。

有很多组合模块的方法，我创建了stackblitz来向您展示如何完成这些模块。
您的方法行不通，因为您导出了default，而当您尝试import './lib1';命名此类模块时，它只是未知的。
此外，import * as Api仅在您有多个named导出但没有一个default导出时才有效。
如我所见，您要将多个库合并到一个导出的对象。
有几种方法可以实现您的目标：

1. 仅导出命名函数（我的最爱）：

lib1

export function Func1() {
return ...;
}
export function Func2() {
return ...;
}


然后在主文件中：

import * as lib1 from './lib1';
export default {
...lib1
}


1. 按照您的示例导出默认值

lib1

export default {
Func1() {},Func2() {}
}


然后在主文件中：

import lib1 from './lib1';
export default {
...lib1
}


1. 导出默认但已合并

lib1

export default {
Func1() {},Func2() {}
}


然后在主文件中：

import lib1 from './lib1';
export default {
lib1
}


，但是在其他文件中，您应该像这样使用它：

import Api from '@api/api';
Api.lib1.Func1()


注意：在当前配置下，您应该使用import Api from '@api/api';，而不使用*
此外，与named相比，default的进口还算不错的article。

index.js是我的主意。将所有库导入到同一目录中的index.js中，然后从该文件中全部导出。然后，您可以将它们全部导入一个内衬中。

index.js

import lib1 from './lib1';
import lib2 from './lib2';
import lib3 from './lib3';
export {
lib1,lib2,lib3,};


vue

import { lib1,lib3 } from '@/[directory with index.js]';


或者我认为以下内容也可以使用，并且会像这样使用：

import libs from '@/[directory with index.js]';
libs.lib1.someFunction();