如何在 Dataview 中导入来自 CDN 的 JavaScript 模块？

疑问解答
1

我最近在使用dataview绘制SVG图像时，发现直接使用JavaScript语句非常麻烦。因此我尝试导入 SVG.js 库。Dataview 中无法通过 npm 等包管理器安装库，我尝试通过CDN导入。这个库可以通过CDNJS导入。

使用import from语句会收到语法错误。

import {SVG} from "https://cdnjs.cloudflare.com/ajax/libs/svg.js/3.2.4/svg.min.js";

dv.span(SVG);

使用require函数收到 Cannot find module

const {SVG} = require("https://cdnjs.cloudflare.com/ajax/libs/svg.js/3.2.4/svg.min.js");

dv.span(SVG);

通过import函数没有异常，但是找不到模块中的函数。

const {SVG} = await import("https://cdnjs.cloudflare.com/ajax/libs/svg.js/3.2.4/svg.min.js");

dv.span(SVG);

我想要了解大佬们通常在Dataview中使用库的方法。

2

没用过库，光导入用 <script> 能导，但感觉用起来很麻烦。

const d3 = Object.assign(document.createElement('script'), {
  src: 'https://cdn.jsdelivr.net/npm/d3',
  type: 'text/javascript', charset: 'utf8',
})
dv.container.appendChild(d3)

image

2 个赞
3

多谢解答。通过检测开发者工具，使用import函数和script元素一样成功导入了模块。找不到函数可能只是我调用的方法不正确。

看来Obsidian这样的项目归根结底还是浏览器模型。过去我一直在Dataview中通过Commonjs的方式导入模块，带来了许多困惑。

4

能看看你的代码吗，我也想知道怎么在dvjs代码里导入模块