为什么向我的文件添加 "import" 会导致 "require.config()" 调用不再有效？

Why does adding an "import" to my file cause the "require.config()" call to no longer work?

在我将设置应用到 require.config 的文件中，我还放置了其他设置，其中包括使用 typescript 的导出功能导入视图模型。我注意到它在所有浏览器中都产生了错误：

requireConfig.ts

import HomePage from "Custom/HomePage";

require.config
({
    baseUrl: "/Scripts/",    
    paths: {},
    shim: {}
});

require (["Custom/Initialisation/ConfigOnDocReady"]);

Uncaught TypeError: require.config is not a function at Object.<anonymous> (RequireConfig.ts:3)

当我删除第 1 行时，它起作用了。是什么原因造成的？我认为这是了解 requireJs 幕后内容的好机会。

总结

RequireJS 在本地和全局提供 require。您正在通过本地提供的 require 呼叫 config。本地 require 没有 config 方法，你会得到你得到的错误。您应该在全局要求上调用 config。 RequireJS 将别名导出到全局 require 作为 requirejs，或者您可以作为 window.require.

访问它

长篇解释

RequireJS 的本地和全局 require 调用

RequireJS 提供了两个访问 require 的点：一个是全局的，一个是本地的。在浏览器中，全局的导出到全局的space，window。如果您在调用 define 时明确将其作为依赖列表中的模块请求，则会提供本地 require。调用 define 是用 AMD 加载程序（这就是 RequireJS 是什么）注册 AMD 模块的标准方法。这里回调的参数是本地 require:

define(['require'], function (require) {
});

（如果你完全省略依赖列表，它也会自动提供给回调，但这种情况不必在这里耽搁我们。）

本地require没有提供config方法。如果它这样做就没有多大意义，因为调用 config 具有全局效果。例如，没有规定只为上下文中的某些模块更改 baseUrl 而不是其他模块。所以 RequireJS 只在全局 require.

上提供了一个 config 方法

“但是等等”，你说，“我不会在任何地方打电话给 define！”

否，但 TypeScript 正在发出调用 define.

的代码

TypeScript 如何发出您的代码

当您删除 import 时，您的代码可以正常工作，因为 TypeScript 会根据它是否存在输出截然不同的代码：

  1. 当你有 import 语句时，你的代码被包裹在与我展示的 define 相似 的东西中上面，因此，您对 require 的调用是对 local 的调用。 （由 tsc 生成的 define 包装器更复杂，但这在这里并不重要。）

  2. 如果没有import/export语句，代码被认为是“脚本”，TypeScript不会输出任何与模块相关的代码。特别是，发出的代码不会有我上面显示的 define 包装器，并且您对 require 的调用是对 global 的调用.

结果

如果你想从模块内部更改配置，你应该注意调用全局 require。 RequireJS 也以 requirejs 别名导出它。所以你可以调用requirejs.config。或者您可以通过 window 作为 window.require.

显式访问它