Webpack生产模式下的JS错误,但开发模式下的JS错误-帮助我找到原因

时间:2018-12-28 09:17:34

标签: javascript webpack babeljs babel

我是一名前端开发人员(最近从后端开发过渡到前端开发),我从前任继承了我们的Javascript代码库,并试图维护和优化它。

我们有一个问题,就是Java代码在生产环境和开发环境中的行为会有所不同。有些错误只会在生产中发生,并且我不知道行为的差异来自何处。我们的目标是在开发和生产环境中都具有相同的行为,更重要的是要有错误,因此,当代码上线(生产环境)时,我们可以确保不会出现意外错误。

我们的构建过程适用于Webpack(webpack@4.17.1),我们也使用babel(@ babel / core @ 7.0.0)来转换我们的Javascript代码。

我做了一些研究,以找出差异的根源。我想到的一件事是strict mode,但据我了解,严格模式也已在开发环境中使用,所以这可能不是原因。

这是此行为的简单示例。 我们有一个称为Utility.js的js文件,它只是有用方法的集合:

/**
 * @param {String} url
 * @returns {Promise}
 */
export function loadScript(url) {
    let loaded = this.getData('scriptsLoaded', []);
    ...
}


/**
 * @param {String} key
 * @param {*} [type={}]
 * @returns {*}
 */
export function getData(key, type = {}) {
    window.auskunft = window.auskunft || {};
    return window.auskunft[key] = window.auskunft[key] || type;
}

现在loadScript()在其他地方被调用,并且因为我们不在类上下文中(我想这是从类重构为独立方法的集合),所以无法使用“ this”来调用getData()。

这会导致生产环境中的错误(影响/停止其余js代码),但是在开发中不会发生此错误,并且一切正常。我希望在开发和生产环境中都会遇到错误。

这是生产错误:

  

utilities.js:68未捕获(承诺)TypeError:this.getData不是   Function.value处的Object.p(utilities.js:68)中的函数   (client.js:163)在t.value(app.js:27)在main.js:14

因此,如果有人有什么线索可能导致这种差异以及在哪里寻找解决此问题的方法,那将非常棒!

0 个答案:

没有答案