如何将 ReactBootstrap 导入 React
how to import ReactBootstrap to React
我正在尝试设置以使用 node、express 和 React。因此，当我使用 res.sendFile() 为我的 html 文件提供一些 React 脚本时，一切都解决了，但是当我尝试导入 ReactBoostrap 时，它开始调用错误 'require is not defined'。
所以我搜索 google 并发现我需要使用 webpack 之类的东西来修复它并且我做到了。但现在它不像我导入按钮那样工作，但它只显示普通按钮。所以我只想问问是否有人可以指导我如何设置节点、用 React 表达以及如何正确导入 ReactBoostrap。
您必须在页面中包含 bootstrap css。
摘自 react-bootstrap 文档：
Stylesheets
Because React-Bootstrap doesn't depend on a very precise version of
Bootstrap, we don't ship with any included css. However, some
stylesheet is required to use these components. How and which
bootstrap styles you include is up to you, but the simplest way is to
include the latest styles from the CDN.
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet"href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap-theme.min.css">
For more advanced use cases you can also use a bundler like Webpack or
Browserify to include the css files for you as part of your build
process but that is beyond the scope of this guide. Also see
http://getbootstrap.com/customize/ for details about customizing
stylesheets to match your component use.
所以，只需将这一行放入 <head>
<link rel="stylesheet"href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">
我正在尝试设置以使用 node、express 和 React。因此，当我使用 res.sendFile() 为我的 html 文件提供一些 React 脚本时，一切都解决了，但是当我尝试导入 ReactBoostrap 时，它开始调用错误 'require is not defined'。 所以我搜索 google 并发现我需要使用 webpack 之类的东西来修复它并且我做到了。但现在它不像我导入按钮那样工作，但它只显示普通按钮。所以我只想问问是否有人可以指导我如何设置节点、用 React 表达以及如何正确导入 ReactBoostrap。
您必须在页面中包含 bootstrap css。
摘自 react-bootstrap 文档：
Stylesheets
Because React-Bootstrap doesn't depend on a very precise version of Bootstrap, we don't ship with any included css. However, some stylesheet is required to use these components. How and which bootstrap styles you include is up to you, but the simplest way is to include the latest styles from the CDN.
<!-- Latest compiled and minified CSS --><link rel="stylesheet"href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">
<!-- Optional theme --><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap-theme.min.css">For more advanced use cases you can also use a bundler like Webpack or Browserify to include the css files for you as part of your build process but that is beyond the scope of this guide. Also see http://getbootstrap.com/customize/ for details about customizing stylesheets to match your component use.
所以，只需将这一行放入 <head>
<link rel="stylesheet"href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">