Question

我正在使用ReactBootstrap构建应用程序。我无法弄清楚如何将我的代码放入单独的文件中，所以我开始使用require.js。我开始了一个单独的项目，作为一个游乐场，试验在我的大项目中需要我需要的各种模块。

我能够自己做出反应（和反应）。但是，只要我在react-bootstrap上执行require（），我就会收到以下错误：

GET http://localhost:5000/static/react-dom.js              require.js:1952
Uncaught Error: Script error for "react-dom"               require.js:165

请注意，上述地址不是react-dom的正确位置。我不知道为什么它在那个地方寻找它。这可以在我的config.js文件中看到，它准确地描述了我的相关JavaScript先决条件模块的位置：

requirejs.config({
  baseUrl: "/static",
  paths: {
    jquery: "vendors/jquery/dist/jquery",
    jsx: "vendors/jsx-requirejs-plugins/js/jsx",
    JSXTransformer: "vendors/jsx-requirejs-plugins/js/JSXTransformer",
    react: "vendors/react/react-with-addons",
    react_dom: "vendors/react/react-dom",
    bootstrap: "vendors/bootstrap/dist/js/bootstrap",
    react_bootstrap: "vendors/react-bootstrap/react-bootstrap",
    text: "vendors/requirejs-text/text",
  },
  jsx: {
    fileExtension: ".js"
  },
});

此时，我甚至没有渲染任何有趣的东西（以此为借口）。通过查看我相当空的app.js文件可以看出这一点：

requirejs(
    ["jquery", "react", "react_dom", "react_bootstrap"],
    function($, React, ReactDOM) {
});

将上述代码更改为：

时没有错误

requirejs(
    ["jquery", "react", "react_dom"],
    function($, React, ReactDOM) {
});

在列表中添加bootstrap无济于事。值得注意的是，JQuery正在从http://localhost:5000/static/vendors/jquery/dist/jquery.js

正确加载

对于上下文，我的index.html文件如下所示。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
</head>
<body>
  <script src="/static/vendors/requirejs/require.js"></script>
  <script src="/static/config.js"></script>
  <script src="/static/app.js"></script>
</body>
</html>

总结一下：我收到一个特定库的错误 - 特别是，它在错误的位置被查找 - 但是当另外需要react-bootstrap时，该错误才会出现。

我错过了什么？谢谢！

Answer 1

问题在于我在config.js中自由命名，反应为“react_dom”，主要是为了解决破折号在没有用引号括起来的情况下不起作用的事实。然后，react-bootstrap专门要求react-dom，这就是为什么错误的URL被击中的原因。

继续使用正确的命名方案，一切都很有效！

如何在不破坏反应的情况下加载react-bootstrap？

1 个答案: