通過桶導入函數時出現“Uncaught TypeError: Object(...) is not a function”

Question

我在名為merge的文件中有一個函數，其中包含

export default (prev, next) => Object.assign({}, prev, next)

我也有一個桶，可以導入和導出這個功能，比如

import fetchToNode from './fetchToNode'
import mergeObjects from './mergeObjects'

export {
    fetchToNode,
    mergeObjects
}

如果我從它的原點導入函數（ import merge from 'src/functions/merge' ）一切正常。

但是，如果我嘗試從桶中導入此函數（ import {merge} from 'src/functions' ），則會出現錯誤

redux.js:449 Uncaught TypeError: Object(...) is not a function

Answer 1

您沒有正確地從桶中導出。 嘗試這樣的事情：

src/functions/index.js:

export { default as mergeObjects } from './mergeObjects';
export { default as fetchToNode } from './fetchToNode';

進而

import { mergeObjects, fetchToNode } from 'src/functions'; 

您導出它的方式用於以下用途：

import functions from 'src/functions';

console.log(functions.merge) // merge function

您可以查看有關桶出口的有用鏈接

看看它如何為桶策划這些例子？

export * from './mergeObjects'; // re-export all of its exports
export * from './fetchToNode'; // re-export all of its exports

在我們的例子中，我們不需要重新導出所有的導出（但上面的代碼片段也有效），而只需要重新導出它的default ，因為您的函數是這樣編寫的：

export default (prev, next) => Object.assign({}, prev, next)

因此export { default as merge } from './merge' default意味着在export default () ...來自上面merge.js的函數

Answer 2

將您的桶文件更新為，它應該修復它：

export * from './fetchToNode'
export * from './mergeObjects'