Question

我想使用CommonJS在我的react jsx文件中包含semantic-ui。我在bower上安装了semantic-ui，并正确配置了webpack以包含bower_components目录。

然而，当我使用时在jsx文件中require('semantic-ui/dist/semantic-ui.js')，控制台总是抛出错误“未捕获的ReferenceError：jQuery未定义”，即使我在此之前添加了语句var jQuery = require('jquery/dist/jquery.js')。

另一个相关的事情是，为了使语义ui工作，还应该包括semantic.css。我也想知道如何在jsx文件中包含semantic.css。

Answer 1

尝试provide-plugin，如此：

public override void OnActionExecuting(HttpActionContext actionContext)
{
    var parameterDescriptor = actionContext.ActionDescriptor.GetParameters().FirstOrDefault(x => typeof(CollectionFilterMapping).IsAssignableFrom(x.ParameterType));

    if (parameterDescriptor != null && actionContext.ActionArguments[parameterDescriptor.ParameterName] == null)
    {
        actionContext.ActionArguments[parameterDescriptor.ParameterName] = Activator.CreateInstance(parameterDescriptor.ParameterType);
    }

    base.OnActionExecuting(actionContext);
}

Answer 2

至于CSS，你需要在获取JS之前在index / whatever.html文件中加载它。

在需要semantic-ui之前，请尝试以下操作：

var $ = jQuery = require('jquery/dist/jquery.js');
window.jQuery = $; // Assure it's available globally.
var s = require('semantic-ui/dist/semantic-ui.js');

不是100％确定这会有效，但值得一试。

CommonJS模块可能会变得棘手。此外，可能值得研究React + Browserify。使用require导入NPM模块非常简单。

如何使用semantic-ui与webpack做出反应？

2 个答案: