如何导入 popper.js？（不使用 CDN，使用 NPM 安装）答案

【问题标题】：How to import popper.js?如何导入 popper.js？（不使用 CDN，使用 NPM 安装）
【发布时间】：2019-01-05 20:40:57
【问题描述】：

我知道还有其他类似的问题，例如 one。然而我的完全不同。

我想知道如何使用 import 指令导入 Popper.js。到目前为止，我的app.js 上有这个（但它还不能工作）

import * as popper from 'popper.js'
window.popper = popper

但我必须用popper. 修改我在 Internet 上找到的每个示例。此外，这个包含需要两行，而传统的写作window.popper = require('popper.js') 只需要一行。

导入 Popper.js 等类似 JS 库的正确方法是什么？

【问题讨论】：

import Popper from 'popper.js'; 够用了。只有 Bootstrap 需要窗口分配
不，不是，因为Popper 因此无法全局访问。我必须把它放到document.Popper。所以它需要额外的一行。
如果你使用的是 ES 模块，你不应该依赖全局可访问的模块
不幸的是我需要这个:(
然后按照我上面的描述导入后将其分配给窗口

标签： javascript npm import

【解决方案1】：

在bootstrap 4中你需要添加popper js作为tooltip，我也不明白为什么bootstrap 4包含外部popper.js，这意味着升级到最新版本时bootstrap变得更加复杂而不是简单。

你可以在 Angular 或简单的 html 上引导之前导入 popper js，Angular 导入是这样的

npm install popper.js --save

然后转到 .angular-cli.json 并更改如下所示的顺序。

"scripts": [
        "../node_modules/jquery/dist/jquery.slim.min.js",
        "../node_modules/tether/dist/js/tether.min.js", 
        "../node_modules/popper.js/dist/umd/popper.js",              
        "../node_modules/bootstrap/dist/js/bootstrap.min.js"
      ],

【讨论】：