前言:前端小白一枚,刚注册博客,先发个学习过程中新碰到小问题试试水吧~

摘要:最近在学习bootstrap,偶然碰到了一个小问题,bootstrap网站也没有做过多的解释,今天分享给大家。

问题描述:使用bootstrap的dropdown部件,打开网页后点击dropdown,报了如下错误:error:Bootstrap dropdown require Popper.js

bootstrap代码(只要是含dropdown部件的都可以啦)为:

<ul class="nav nav-tabs">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">Animation</a>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
</div>
</li>
</ul>

看错误提示,应该是要导入Popper.js文件,网上查了下方法,可以直接工程目录下使用npm安装:npm install --save popper.js

安装好后,我们可以在目录下找到node_modules文件夹,然后将popper.js文件引入html()。

保存好刷新网页再试了一下,发现还是不行,仍报了刚才的错误。于是我检查了一下node_modules->dist文件夹下的popper.js文件,发现有3个这样的文件(esm和umd文件夹下也各有一个popper.js文件)。再于是我把它们分别引入后再操作一下dropdown部件,最后在引入umd文件下的popper.js后^_^,bingo--终于是可以用了YY。虽然不知道为啥会这样,但也算是成功解决了问题。

最后贴上一个参考资料路径:https://github.com/twbs/bootstrap/issues/23381

使用bootstrap的dropdown部件时报错:error:Bootstrap dropdown require Popper.js的更多相关文章

  1. 打包新版本上传到AppStore时报错 ERROR ITMS-90034:

    今天打包新版本上传到AppStore时报错 ERROR ITMS-90034:"Missing or invalid signature.The bundle'com.xxx.xxx' at ...

  2. 运行项目npm run dev时报错: ~Error: Cannot find module 'webpack-cli/bin/config-yargs', 原因是

    webpack@3.X运行项目npm run dev时报错: ~Error: Cannot find module 'webpack-cli/bin/config-yargs' 我的原因是:  web ...

  3. MySQL 从 5.5 升级到 5.6,启动时报错 [ERROR] Plugin 'InnoDB' init function returned error

    MySQL 从 5.5 升级到 5.6,启动时报错: [ERROR] Plugin 'InnoDB' init function returned error. [ERROR] Plugin 'Inn ...

  4. 安装模块时报错“error: Microsoft Visual C++ 14.0 is required…”

    安装pymssql时报错:在安装的过程中遇到了“error: Microsoft Visual C++ 14.0 is required…” 解决办法: 进入https://www.lfd.uci.e ...

  5. 执行automake时报错 error while making link: Operation not supported

    执行automake时报错: [root@localhost project]# automake --add-missingconfigure.in: installing `./install-s ...

  6. javah生成jni头文件时报错 Error: cannot access android.support...

    javah生成jni头文件时报错: Error: cannot access android.support.v7.app.AppCompatActivity class file for andro ...

  7. 使用cocoapods install友盟时报错Error installing UMengAnalytics

    报错: [!] /usr/bin/unzip /Users/soindy/Documents/SmartThermo/ios/SmartThermo/Pods/UMengAnalytics/file. ...

  8. Uncaught Error: Bootstrap dropdown require Popper.js

    Bootstrap 要求Popper.js 如果安装了Popper.js还报错,肯定就是Popper的问题 https://cdn.bootcss.com/popper.js/1.12.5/umd/p ...

  9. Bootstraps 4 引入报错 Error: Bootstrap tooltips require Tether

    问题: 解决办法 (http://github.hubspot.com/tether/) Bootstrap 4 needs Tether, so you need to include tether ...

随机推荐

  1. 对比 Git 与 SVN,这篇讲的很易懂

    ---恢复内容开始--- 欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 本文由腾讯工蜂发表于云+社区专栏 导语 本文从 Git 与 SVN 的对比入手,介绍如何通过 Git-SVN 开始 ...

  2. python 自学之路-Day one

    一.Python介绍 创始人吉多范罗苏姆(龟叔),脚本解释程序 应用领域广,数据分析.组件集成.网络服务.图像处理.数值计算和科学计算等. 主要应用领域: 云计算:OpenStack: WEB开发:经 ...

  3. 用SQL将JSON数据输出表值数据

    自己练手写了一个将JSON数据输出成表值数据的存储过程 存储过程代码 CREATE PROC Proc_JsonConvertTable(@JSON VARCHAR(MAX)) AS --JSON测试 ...

  4. softmax函数详解

    答案来自专栏:机器学习算法与自然语言处理 详解softmax函数以及相关求导过程 这几天学习了一下softmax激活函数,以及它的梯度求导过程,整理一下便于分享和交流. softmax函数 softm ...

  5. 空间数据可视化之ArcLayer详解

    deck-overlay中 首先使用d3中的scaleQuantile将数据进行分类,scaleQuantile方法是d3中的一种数据分类方法(https://www.cnblogs.com/kids ...

  6. IIS虚拟目录挂载文件服务器目录

    要求说明: 通过网站上传文件保存到统一的文件服务器上. 服务器说明: 1.文件服务器以下称为FilesServer,IP地址为:192.168.1.213 2.Web服务器为以下称为WebServer ...

  7. PHP面向对象特性

    目录 创建对象 成员属性 成员方法 构造方法 析构方法 垃圾回收机制 访问修饰符 魔术方法 对象比较 继承 重载 属性重载 方法重写 属性重写 静态属性 静态方法 多态 类型约束 抽象类 接口 fin ...

  8. WaitGroup

    WaitGroup在go语言中,用于线程同步,单从字面意思理解,wait等待的意思,group组.团队的意思,WaitGroup就是指等待一组,等待一个系列执行完成后才会继续向下执行. 先说说Wait ...

  9. shell打印 倒等腰三角形

    #!/bin/bash read -p "input the length: " n方法一:内循环中的一个for循环shell写法for i in `seq 1 $n`do    ...

  10. 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 二十二║Vue实战:个人博客第一版(axios+router)

    前言 今天正式开始写代码了,之前铺垫了很多了,包括 6 篇基础文章,一篇正式环境搭建,就是为了今天做准备,想温习的小伙伴可以再看看<Vue 基础入门+详细的环境搭建>,内容很多,这里就暂时 ...