Module.exports和es6導入

與巴貝爾的反應。我對導入和module.exports有這個困惑。我將ES6代碼轉換爲ES5時假設爲babel，分別將導入和導出轉換爲require和module.exports。Module.exports和es6導入

如果我從一個模塊導出函數並將該函數導入到另一個模塊中，則代碼執行得很好。但是，如果我使用module.exports導出函數並使用「導入」導入，則會在運行時引發錯誤，說它不是函數。

我製作了一個例子。

// Tiger.js 
function Tiger() { 
    function roar(terrian){ 
     console.log('Hey i am in ' + terrian + ' and i am roaing'); 
    }; 
    return roar; 
} 

module.exports = Tiger; 

// animal.js 
import { Tiger } from './animals'; 

var animal = Tiger(); 
animal("jungle");

我用預設es2015的babel來反編譯它。這給了我下面的錯誤

Uncaught TypeError: (0 , _animals.Tiger) is not a function

但如果我刪除module.exports = Tiger;並與export { Tiger };取代它，它工作正常。

我在這裏丟失了什麼？

編輯： 我正在使用browserify作爲模塊打包器。

來源

2015-12-14 Nani

你看過巴別爾輸出了嗎？看着'Tiger.js'的傳輸源將立即告訴你它爲什麼不起作用。長話短說：堅持使用一個模塊系統或使用像webpack這樣的模塊捆綁器來處理不一致問題。 – GJK

對不起，我正在使用browserify作爲模塊打包器 – Nani

export { Tiger }將相當於module.exports.Tiger = Tiger。相反，module.exports = Tiger將相當於export default Tiger。因此，當您使用module.exports = Tiger然後嘗試import { Tiger } from './animals'時，您實際上需要Tiger.Tiger。

來源

2016-01-14 16:52:35

那麼正確的導入語句在這裏是什麼？它只是從''進口虎'/動物'？ –

我相信如此，假設你不想改變tiger.js –

Module.exports和es6導入

回答

相關問題