1

我目前正在尝试使用“ReactJS.NET”在服务器端渲染一些 ReactJS-stuff（来自不同的教程）。

但是，我总是收到以下消息：

找不到名为“评论框”的组件。您是否忘记将其添加到 App_Start\ReactConfig.cs？

看这里的代码似乎很简单。

我的 ReactConfig.cs：

public static class ReactConfig
{
    public static void Configure()
    {
        ReactSiteConfiguration.Configuration
            .AddScript("~/Scripts/dist/CommentBox.js");
    }
}

我看不出我在这里做错了什么，因为我认为我只需要将生成的（通过 webpack）添加CommentBox.js到配置中并完成。

在我看来，我只是尝试@Html.React("CommentBox",new {})在引发异常的时候调用。

这是可以在生成的 javascript 文件中找到的代码：

var CommentBox = (function (_super) {
    __extends(CommentBox, _super);
    function CommentBox() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    CommentBox.prototype.render = function () {
        return __WEBPACK_IMPORTED_MODULE_0_react__["createElement"]("div", { className: "commentBox" },
            __WEBPACK_IMPORTED_MODULE_0_react__["createElement"]("h1", null, "Comment-Box"),
            __WEBPACK_IMPORTED_MODULE_0_react__["createElement"](CommentForm, null),
            __WEBPACK_IMPORTED_MODULE_0_react__["createElement"](CommentList, null));
    };
    return CommentBox;
}(__WEBPACK_IMPORTED_MODULE_0_react__["Component"]));
4

5 回答 5

1

我认为您可以尝试将其称为 @Html.React("Components.CommentBox",new {})。我认为，作为曝光器以这种方式工作。我现在正在尝试同样的事情并且也得到了这个错误。这对我有帮助，但还有更多错误:)

于 2017-02-17T11:45:05.320 回答
1

我正在使用 Webpack 2.2.1 并以这种方式解决问题。首先将我的组件暴露在一个对象中，然后我就结束了

expose const CommentBox;

之后，在 webapck 配置文件中，我有这样的东西

{
   entry: '/path/to/CommentBox.js',
   output: {
      library: ['MyComponents'],
      libraryTarget: 'this'
   }
}

这样，webpack 就会暴露在全局对象上（你运行的是 V8，所以是 node env），对象 MyComponents.CommentBox

于 2017-03-05T11:37:48.500 回答
0

如果你在 ReactJS.NET 中使用 Webpack，你需要公开组件以便 ReactJS.NET 可以访问它们。请参阅此处的指南：https ://reactjs.net/guides/webpack.html

于 2017-02-14T06:05:51.710 回答
0

我发现我需要引用组件的完整命名空间路径。例如，在我的情况下，组件名称ResourceAttributesComponent在Portal.Scheduling命名空间中，所以我必须写@Html.React("Portal.Scheduling.ResourceAttributesComponent", new {})

于 2017-04-28T13:29:07.117 回答
0

就我而言，我的组件中缺少默认关键字：export default function Test() {...} https://github.com/reactjs/React.NET/issues/835#issuecomment-502616611

于 2019-06-17T11:47:18.803 回答