我正在尝试从Next.js项目导入Bootstrap。导入的顺序是:
import 'jquery';
import 'bootstrap';
我试过另一种语法...
require('jquery');
require('bootstrap');
但结果是一样的...
类型错误:无法读取未定义的jQueryDetection /node_modules/bootstrap/dist/js/bootstrap的属性'jquery'。js:243:26
我颠倒了导入的位置,但不起作用...
我在index.js页面,和...我有两个软件包安装
3条答案
按热度按时间h5qlskok1#
这里的问题是,每当加载此页面时,您的页面都试图导入
bootstrap
,包括当Next.js服务器(或next export
进程)在服务器端呈现此页面时。但是, Bootstrap 不能在服务器端运行,因为它在启动过程中查找window.jquery
,而window
在节点env中未定义。要解决此问题,您必须将
bootstrap
、jquery
和popper.js
的导入包含在检查中,以确保它们仅在客户端导入:3zwtqj6y2#
Sample _app.tsx基于@Zack的答案,但是这个例子使用了导入来获得完全兼容的代码
yruzcnhs3#
我也试图解决这个问题,但我使用的是react-bootstrap,它工作正常