RequireJS 配置与不支持 AMD 的模块

Question

因此，我正在尝试阅读Require JS API 文档以弄清楚应该如何正确完成此操作，但我一直无法加载库，因此它不会被定义为未定义。 我通过 NPM-WebJars 使用它，但我想你如何定义它并不重要。

基本上，我正在尝试使用在我的项目中工作的 react-bootstrap-switch -library 。 这是Pastebin 中的JavaScript 文件源，因为它可能会在主分支中发生变化。 react-bootstrap-switch 使用exports.default = Switch 定义库。 我有几个使用 RequireJS 定义的其他模块，它们具有 AMD 支持并且正在工作。

这是我如何使用 RequireJS

requirejs.config("paths":{"react-bootstrap-switch":["@routes.WebJarAssets.at("react-bootstrap-switch/15.0.0/dist/js/index")"]}}); // the file location

使用图书馆

define(['react', 'react-bootstrap-switch'], function(React, Switch){
     console.log(Switch); // <- undefined
} 

因此，仅使用标准的 requirejs.config -import 就行不通，因为缺少 AMD 支持。 所以我想我应该使用垫片，但我该怎么做呢？ 我一直在阅读它，但我无法正确导入使用它的库。 它可能应该很容易，但它似乎不起作用。 例如

 requirejs.config({
             "paths":{"react-bootstrap-switch":["@routes.WebJarAssets.at("react-bootstrap-switch/15.0.0/dist/js/index")"]},
             "shim": {
                     "react-bootstrap-switch": {
                          exports: 'Switch'
                      }}});

让它未定义。 我一直在尝试使用 init 函数介于两者之间，但我无法在窗口中找到正确的命名空间。 还尝试在路径之前切换填充顺序，尝试使用“默认”而不是“切换”，以及其他一些技巧，但它似乎无法正确导入，因为它卡在未定义状态。

我可以尝试的最后一件事是在本地获取代码并更改为其他内容而不是exports.default 或者只是为此编写我自己的函数，但我想让它工作以供将来参考。

Answer 1

很明显，您尝试加载的是一个经过编译并以 CommonJS 环境为目标的文件。 RequireJS 无法按原样加载此类文件。

您至少需要将其代码包装在define(function (require, exports, module) {开头和}); 在末尾。 一旦你这样做了，它可能会起作用。 您可以使用r.js或任何其他工具进行包装。