找不到模块“bootstrap/dist/js/bootstrap”的声明文件答案

【问题标题】：Could not find a declaration file for module 'bootstrap/dist/js/bootstrap找不到模块“bootstrap/dist/js/bootstrap”的声明文件
【发布时间】：2021-11-30 06:40:28
【问题描述】：

我正在开发一个 nextjs 应用程序并安装了引导程序。样式有效，但是当我尝试导入 bootstrap.bundle.js 文件时出现错误

Could not find a declaration file for module 'bootstrap/dist/js/bootstrap'. 'c:/Users/HP/OneDrive/Documents/webapps/nft-marketplace/node_modules/bootstrap/dist/js/bootstrap.js' implicitly has an 'any' type.

这是我的 pacakage.json

{
  "name": "nft-marketplace",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@nomiclabs/hardhat-ethers": "^2.0.2",
    "@nomiclabs/hardhat-waffle": "^2.0.1",
    "@openzeppelin/contracts": "^4.3.1",
    "@popperjs/core": "^2.10.2",
    "axios": "^0.21.4",
    "bootstrap": "^5.0.0-beta3",
    "chai": "^4.3.4",
    "dropzone": "^5.9.3",
    "ethereum-waffle": "^3.4.0",
    "ethers": "^5.4.6",
    "hardhat": "^2.6.4",
    "ipfs-http-client": "^52.0.3",
    "next": "11.1.2",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "web3modal": "^1.9.4"
  },
  "devDependencies": {
    "@types/bootstrap": "^5.1.6",
    "autoprefixer": "^10.3.4",
    "eslint": "7.32.0",
    "eslint-config-next": "11.1.2",
    "postcss": "^8.3.6",
    "tailwindcss": "^2.2.10"
  }
}

这是我的 app.js 文件

import "bootstrap/dist/css/bootstrap.css";
import "../styles/globals.css";
import { useEffect } from "react";
import "../styles/app.css";

function MyApp({ Component, pageProps }) {
  useEffect(() => {
    import("bootstrap/dist/js/bootstrap");
  }, []);

  return <Component {...pageProps} />;
}

export default MyApp;

我已经搜索并尝试了不同的解决方案。我也安装了 @types/bootstrap 但仍然没有工作。我究竟做错了什么？我需要帮助这个问题让我很困惑。

【问题讨论】：

我无法复制该问题。出于好奇，您为什么要导入 bootstrap 而不将其分配给变量？

标签： javascript twitter-bootstrap bootstrap-4 next.js

【解决方案1】：

这对我有用

useEffect(() => {
  typeof document !== undefined 
  ? require('bootstrap/dist/js/bootstrap') 
  : null
}, [])

【讨论】：

您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息，例如引用或文档，以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center。

【解决方案2】：

如果你使用 bootstrap 5 尝试安装 propperjs

npm install @popperjs/core --save

【讨论】：