1. 首页
  2. 问题
  3. 如何在Webpack中使用语义UI
小编典典

如何在Webpack中使用语义UI

reactjs

我想使用CommonJS在我的react
jsx文件中包含语义UI。我用bower安装了语义UI，并且将webpack正确配置为包括bower_components目录。

但是，当我require('semantic-ui/dist/semantic-ui.js')在jsx文件中使用时 ，即使在该语句`var jQuery

require(‘jquery/dist/jquery.js’)`之前放置一个语句，控制台也总是会抛出错误“未捕获的ReferenceError：未定义jQuery”
。

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


阅读 358

收藏
2020-07-22

共1个答案

小编典典

至于CSS，您将需要在采购JS之前将其加载到index / whatever.html文件中。

在需要语义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。使用导入NPM模块变得非常简单require。

2020-07-22