2

在升级我们支持的浏览器 (~40 -> ~60) 之后,我正在尝试诊断最近出现的问题

我们在一个外部(现在不受支持)库中有这个有效的代码,它位于一个 iffe 中:

(function(window, undefined){
    # external library
    if(!window.terribleIdea){
        window.terribleIdea = {}
    }
    <some code>
    if(!window.terribleIdea.config.url){
        window.terribleIdea.config.url = 'the wrong url'
    }

    localStorage.set('somethingImportant', getStuff(window.terribleIdea.config.url))
})( window );

现在我们确实有一个如下所示的引导类型文件:

# appBootstrapper.js
import applyConfig from './app/configApplier';
import ALL_ANGULAR_MODULES from './app'; # contains angular.module set up for 
                                         # app and every dependency

fetchConfig()
    .then(applyConfig)
    .then () => angular.bootstrap(document, [ALL_ANGULAR_MODULES])
    .catch( error => {
        alert(`It borked:  ${error.message}`)
    });

除其他事项外applyConfig

window.terribleIdea = {
    config: {
        url: 'not terrible'
    }
}

现在发生的情况是,ALL_ANGULAR_MODULES 的导入语句最终运行外部库中的代码,并设置本地存储。我们认为过去发生的事情是它只在angular.bootstrap运行时被调用。

现在我需要知道的是,在更高版本的 chrome 中 import 语句的功能是否发生了变化,或者它是否一直在运行这段代码而被忽视?

我所能找到的只是对Dynamic Imports的引用,以及<script></script>标签中脚本运行的顺序。

4

1 回答 1

1

如果不访问项目,就很难调试(参见上面评论中的讨论)。在遇到此类问题时,这里有一些值得探索的可能性。当然也有可能一直都是这样。

  • 更改捆绑程序配置。Webpack 接受entries数组,并在其中排序。
  • 改变捆绑器/依赖管理器对动态的反应方式imports
  • 更改应用程序在其bootstrap阶段加载其依赖项的方式。它不是(imo)特定于角度的,因为许多应用程序使用某种“组件化”,它以不同的导入顺序执行文件(因为它们可能只导出构造函数或诸如此类)。
于 2018-09-17T16:12:40.640 回答