如何插入twitter-bootstrap js文件来使用webpack来响应应用程序?我知道reactstrap和react-bootstrap等react库,但我想知道如何在没有这些库的情况下插入bootstrap.js文件。
zzwlnbp81#
您可以通过npm/yarn安装Bootstrap和jQuery:
npm install bootstrap jquery
然后将Bootstrap导入顶级React文件(入口点):
import 'bootstrap/dist/css/bootstrap.min.css' import 'jquery/dist/jquery.min.js' import 'bootstrap/dist/js/bootstrap.min.js'
当然,您需要适当的Webpack规则来转换CSS。在React中使用Bootstrap的问题是它需要jQuery,现在有两件事在干扰DOM,这是一个麻烦的处方。这是Reactstrap(用于Bootstrap 4)和React-Bootstrap(现在也支持Bootstrap 4)的真实的价值主张;它们消除了对jQuery的依赖,并将功能实现为React组件。尝试将jQuery与React结合使用会给您带来蠕虫。我已经做到了;我不建议这样做。
9o685dep2#
对于Bootstrap版本5,您还需要安装popper.js。安装
popper.js
npm i bootstrap@5.2.3 @popperjs/core
用途
// /src/index.js import "bootstrap/dist/css/bootstrap.min.css"; import "bootstrap/dist/js/bootstrap.min.js";
2条答案
按热度按时间zzwlnbp81#
您可以通过npm/yarn安装Bootstrap和jQuery:
然后将Bootstrap导入顶级React文件(入口点):
当然,您需要适当的Webpack规则来转换CSS。
在React中使用Bootstrap的问题是它需要jQuery,现在有两件事在干扰DOM,这是一个麻烦的处方。这是Reactstrap(用于Bootstrap 4)和React-Bootstrap(现在也支持Bootstrap 4)的真实的价值主张;它们消除了对jQuery的依赖,并将功能实现为React组件。尝试将jQuery与React结合使用会给您带来蠕虫。我已经做到了;我不建议这样做。
9o685dep2#
对于Bootstrap版本5,您还需要安装
popper.js
。安装
用途