微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何在 webpack treeshaking 中排除自定义构造函数?

如何解决如何在 webpack treeshaking 中排除自定义构造函数?

我在 JS 文件中有以下代码

(() => {
    const Abc = (ab) => {
        this.ab = ab;
        this.k = () => {
            console.log(this.ab);
        };
    };
    window.myspace = window.myspace || {};
    window.myspace.abc = new Abc('some var');
})();

我使用 webpack 5 作为我的打包器。在此构造函数之后加载的另一个文件中,当我尝试使用 window.myspace.abc.k 时,它抛出了一个错误。通过一些调查,我能够理解输出文件没有 k,这是 TreeShaking 机制的结果。

如何告诉 webpack 在 treeshaking 期间排除这个构造函数/方法

解决方法

window.MySpace.abc = new Abc('some var');

Abc 是一个箭头函数。箭头函数不能用作构造函数,因此这行代码抛出异常,因此没有分配给 window.MySpace.abc。

要解决此问题,请使用常规函数:

function Abc(ab) {
  this.ab = ab;
  this.k = () => {
    console.log(this.ab);
  };
};

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。