Cách hiển thị hàm xuất khẩu thành phạm vi toàn cầu với babel và webpack

Question

Làm cách nào để biên dịch mã của tôi với webpack và babel để chức năng được xuất có sẵn trong phạm vi toàn cục.

Vì vậy, ví dụ:

export function test(){console.log('test')} 

Nên có sẵn dưới window.test().

Khi tôi chỉ cần chạy babel -d tôi nhận được những gì tôi mong đợi:

'use strict'; 

Object.defineProperty(exports, '__esModule', { 
    value: true 
}); 
exports.test = test; 

function test() { 
    console.log('test'); 
} 

nhưng sản lượng webpack trông như thế này:

!function(e) { 
    function t(r) { 
    if (o[r])return o[r].exports; 
    var n = o[r] = {exports: {}, id: r, loaded: !1}; 
    return e[r].call(n.exports, n, n.exports, t), n.loaded = !0, n.exports 
    } 

    var o = {}; 
    return t.m = e, t.c = o, t.p = "", t(0) 
}([function(e, t) { 
    "use strict"; 
    function o() { 
    console.log("test") 
    } 

    Object.defineProperty(t, "__esModule", {value: !0}), t.test = o 
}]); 

chấm dứt test chức năng không có sẵn trong phạm vi toàn cầu.

Answer 1

check out: https://webpack.github.io/docs/library-and-externals.html#examples

Bằng cách đặt các thư viện tài sản đầu ra để bất cứ tên nào bạn muốn quấn globals của bạn sẽ cho phép bạn sau đó gọi: YourLibrary .test();

module.exports = { 
    entry: ['./_js/script.js'], 
    output: { 
     library: 'YourLibrary', 
     path: __dirname, 
     filename: './build/script.js' 
    }