如何将ReactBootstrap导入React

时间:2016-07-12 17:24:27

标签: reactjs react-bootstrap

我正在尝试设置使用node,express和React。所以当我只使用res.sendFile()使用一些React脚本来提供我的html文件时,一切都工作了但是当我尝试导入ReactBoostrap时,它开始调用错误'require is not defined'。 所以我搜索谷歌,发现我需要使用像webpack这样的东西来修复它,我做了。但现在它只是像我导入Button一样不起作用,但它只显示普通按钮。所以我只想问一下是否有人可以给我一个关于如何设置节点,使用React表达以及如何正确导入ReactBoostrap的指南。

1 个答案:

答案 0 :(得分:1)

您必须在页面中包含bootstrap css。

取自react-bootstrap docs:

  

样式表

     

因为React-Bootstrap不依赖于非常精确的版本   Bootstrap,我们不附带任何包含的CSS。但是,有些   样式表需要使用这些组件。怎么样,哪个   你包含的引导样式取决于你,但最简单的方法是   包括CDN的最新款式    string[] readText = File.ReadAllLines(@"p:\CARTAP1.txt"); string input = readText[5]; string result = input.Split(new char[] { ' ' }, StringSplitOptions.RemoveEmptyEntries)[0]; foreach (string s in readText) { if (result == "D") { var cont = 0; //string cont = readText[1]; Console.WriteLine(cont); } Console.WriteLine(s); }

<!-- Latest compiled and minified CSS -->
     

<link rel="stylesheet"href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">

<!-- Optional theme -->
     

对于更高级的用例,您还可以使用Webpack或   Browserify包含css文件作为构建的一部分   过程,但这超出了本指南的范围。另见   有关自定义的详细信息,请http://getbootstrap.com/customize/   样式表以匹配您的组件使用。

所以,只需将此行放入<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap-theme.min.css">

即可
<head>