如何將Webpack構建的庫作爲函數公開？

我正在研究一個JavaScript庫，它本質上是一個與Vue本身捆綁在一起的Vue.js組件。該項目通過vue-cli啓動，並與Webpack一起打包。如何將Webpack構建的庫作爲函數公開？

當這個庫被通過<script>標籤的進口，我想它公開一個單一的功能，如：

Mapboard({div: '#some-div')

庫本身目前只是：

export default (opts) => console.log('hello')

我調整我的Webpack配置來設置庫名稱：

module.exports = { 
    output: { 
    library: 'Mapboard' 
    } 
}

它成功地公開了全局ca大會另作Mapboard，但它的對象，而不是一個函數：

{ 
    __esModule: true, 
    default: function (e) {...} 
}

有什麼辦法來防止從的WebPack出口以此爲ES6模塊？我希望它只是模塊導出的功能，如上所示。

2017-03-10 Rob

嘗試'庫： 'CommonJS的Mapboard''或添加'output.libraryTarget：' commonjs'' –

@Maximus我得到的瀏覽器出錯'未定義輸出' – Rob

你使用什麼腳本加載器？ –

這是ES5和ES6，如果您使用的打字稿建立資料庫，你可能需要分型額外配置...

2017-03-12 00:15:30

本文幫助一個lot.The核心點來解決這個問題是：

這種情況的解決方法是簡單的：簡單的寫一個導入ES6模塊的文件，使用ES6的方式，但是它們以nodeJS module.exports風格導出。然後Webpack將正確處理它們！！

沒錯只要改變你的函數爲：

function foo(opts) { 
    console.log('hello'); 
} 
module.exports = foo;

和預期的一樣正常工作了。

注：代碼編寫這樣可能無法正常工作：

module.exports = function foo(opts) { 
    console.log('hello'); 
}

2017-06-02 09:26:05 Halt

回答