我想使用CommonJS在我的react jsx文件中包含语义UI.我在bower上安装了语义UI,并且将webpack正确配置为包括bower_components目录.
I would like to use CommonJS to include semantic-ui in my react jsx file. I installed semantic-ui with bower, and webpack is correctly configured to include the bower_components directory.
但是,当我使用 require('semantic-ui/dist/semantic-ui.js')在jsx文件中,控制台始终会抛出错误未捕获的ReferenceError:未定义jQuery",即使我在其前面放置了语句var jQuery = require('jquery/dist/jquery.js').
However, when I use require('semantic-ui/dist/semantic-ui.js') in the jsx file, the console always throw an error "Uncaught ReferenceError: jQuery is not defined", even when I put a statement var jQuery = require('jquery/dist/jquery.js') before that.
另一个相关的事情是,为了使语义UI正常工作,还应该包括语义.css.我也想知道如何在jsx文件中包含语义.css.
Another related thing is that in order for semantic-ui to work, semantic.css should also be included. I am also wondering how to include semantic.css in jsx file.
推荐答案对于CSS,您将需要在采购JS之前将其加载到index/whatever.html文件中.
As for the CSS you're going to want to load that in your index/whatever.html file before sourcing your JS.
在需要语义UI之前,请尝试以下操作:
Try the following before you require 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%地确定这是否可行,但是值得一试.
Not 100% sure this will work but it's worth a try.
CommonJS模块会使事情变得棘手.另外,可能值得研究React + Browserify.使用require导入NPM模块变得非常简单.
Things can get tricky with CommonJS modules. Also, might be worth looking into React+Browserify. Makes it super simple to import NPM modules using require.
更多推荐
如何在Webpack中使用语义UI进行响应?
发布评论