twitter-bootstrap Bootstrap 4 Beta - 是否需要 Popper.js?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/46155017/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap 4 Beta - Is Popper.js required?
提问by AndiLeni
i wanted to ask if Popper.js is absolutely necessary or not if i don't use dropdown menus. Are there any other parts driven by popper that would not work without the library?
如果我不使用下拉菜单,我想问一下 Popper.js 是否绝对必要。是否有其他由 popper 驱动的部件在没有库的情况下无法工作?
回答by juzraai
If you search for "popper" in Bootstrap 4's documentation, the following results will come up:
如果您在Bootstrap 4 的文档中搜索“popper”,则会出现以下结果:
Tooltips rely on the 3rd party library Popper.js for positioning.
Popovers rely on the 3rd party library Popper.js for positioning.
Dropdowns are built on a third party library, Popper.js, which provides dynamic positioning and viewport detection.
工具提示依赖于 3rd 方库 Popper.js 进行定位。
Popovers 依靠 3rd 方库 Popper.js 进行定位。
下拉列表建立在第三方库 Popper.js 之上,该库提供动态定位和视口检测。
So these are the Bootstrap 4 components that need Popper.js.
所以这些是需要 Popper.js 的 Bootstrap 4 组件。
Though Popper.js is stated as required for Bootstrap 4, and Bootstrap 4 JS logs an error if it can't find Popper, you can still use Bootstrap 4 JS without Popper, if you don't need tooltips, popovers nor dropdowns.
尽管 Popper.js 被声明为 Bootstrap 4 所必需的,并且 Bootstrap 4 JS 如果找不到 Popper 会记录一个错误,但如果您不需要工具提示、弹出窗口或下拉列表,您仍然可以在没有 Popper 的情况下使用 Bootstrap 4 JS。
EDIT:as OP pointed out in the comments below, modals also require Popper.js.
编辑:正如 OP 在下面的评论中指出的那样,模态也需要 Popper.js。
For example navbar's JS functionality (mobile menu on the right) works well:
例如导航栏的 JS 功能(右侧的移动菜单)运行良好:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#">Disabled</a>
</li>
</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</nav>
回答by Prince Ahmed
Proper.js is not required if you use bootstrap.bundle.jsor bootstrap.bundle.min.jsinstead of bootstrap.jsor bootstrap.min.js. you can download bootstrap.bundle.js or bootstrap.bundle.min.js from hrere
如果您使用bootstrap.bundle.js或bootstrap.bundle.min.js而不是bootstrap.js或bootstrap.min.js ,则不需要 Proper.js 。你可以从hrere下载 bootstrap.bundle.js 或 bootstrap.bundle.min.js
回答by PirateApp
Not anymore, check THISissue It seems Bootstrap has bundled Popper and Bootstrap v4 into a bundle.min.js file that is available if you try downloading now. HEREis a link directly to the bundled min file. Hope that helps someone who is not interested in adding a separate popper file
不再,检查这个问题 似乎 Bootstrap 已将 Popper 和 Bootstrap v4 捆绑到一个 bundle.min.js 文件中,如果您现在尝试下载,该文件可用。 这里是直接指向捆绑的 min 文件的链接。希望能帮助那些对添加单独的 popper 文件不感兴趣的人
回答by Max
Alternatively, if you only use the non-Popper JS functionality of bootstrap, you can fake Popper and load bootstrap (thus Bootstrap will work and won't throw an error about Popper being missing):
或者,如果您只使用 bootstrap 的非 Popper JS 功能,您可以伪造 Popper 并加载 bootstrap(因此 Bootstrap 将起作用并且不会抛出有关缺少 Popper 的错误):
<script>
window.Popper = {}
</script>
<script src="js/bootstrap.min.js"></script>
回答by Zim
Popper.js is required IF you're using Bootstrap JS. It's notrequired if you're using only the Bootstrap CSS.
如果您使用 Bootstrap JS,则需要 Popper.js。它不是,如果你只使用CSS引导需要。

