1

我想在我正在构建的一个简单的 Chrome 扩展中使用 Tippy.js。基本上，我想在我的内容脚本旁边使用 Tippy，但我不知道如何在不使用 cdn 的情况下包含它。

我知道我应该将它与 content_scripts 一起包含在 manifest.json 文件中，但您不应该在此处使用 cdn 链接。如果我使用节点安装软件包，我会在这里找到所有文件：https ://unpkg.com/browse/tippy.js@4.3.5/但我不确定要在清单文件中链接哪个文件。

这是我目前在 manifest.json 中的内容：

"content_scripts": [
        {
            "matches":[
                "<all_urls>"
            ],
            "js": [
                "./node_modules/tippy.js/umd/index.min.js",
                "./src/content.js"]
        }
    ],

我意识到这可能是包含外部库的愚蠢尝试，但我只是不确定如何包含不打包在单个文件中的此类库。

4

2 回答 2

0

对于tippy.js，您还需要popper.js

将这两个文件保存在您的项目中 https://unpkg.com/popper.js@1.15.0/dist/umd/popper.min.js https://unpkg.com/tippy.js@4.3.5/umd/ index.all.min.js

在内容脚本中添加这两个文件，就像您添加的一样

于 2019-09-27T04:04:07.573 回答
0

umd 在这种情况下是一个选择，因为 Chrome 扩展不支持import和export关键字，所以选择node_modules/tippy.js/umd/index.min.js并确保它与您的文件node_modules在同一目录中。manifest.json

"content_scripts": [
        {
            "matches":[
                "<all_urls>"
            ],
            "js": [
                "node_modules/tippy.js/umd/index.min.js",
                "src/content.js"
            ],
            "css": [
                "node_modules/tippy.js/themes/light.css"
            ]
        }
]
于 2019-09-27T06:38:55.433 回答