如何在vs代码webview扩展开发中导入npm包？
如何在vs代码webview扩展开发中导入npm包？
提问于 2020-04-19 16:42:45
我想使用npm (LatextoMathML)，但是当我在我的when视图上使用它时，它会给我运行扩展时的错误，即:未定义的引用:未定义的包名(LatextoXML)。我用require方法尝试了let / var / const。我想在我的js代码中使用webview函数。
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-04-21 18:52:36
您不能以通常的方式将npm包导入到way视图中，例如：
var somelibrary = require('somelibrary')相反，您可以将包作为本地资源加载。
要做到这一点，请遵循以下最小步骤：
- 创建新面板时，启用脚本
const panel = vscode.window.createWebviewPanel(
'viewType',
'view name',
vscode.ViewColumn.One,
{
// Enable javascript in the webview
enableScripts: true
}
);- 将npm包路径包装在一个特殊的vscode uri中。这个uri实际上将包含以下字符串："vscode-resource://file///path-to-extension/node_modules/somelibrary/somelibrary.js“
const libraryPath = vscode.Uri.file(
path.join(extensionPath, 'node_modules', 'somelibrary', 'somelibrary.js')
);
const scriptUri = webview.asWebviewUri(libraryPath);- 创建html面板结构时传递路径
return '
...
<script src='$(scriptUri)'></script>
...
';页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/61307979
复制相关文章
相似问题
腾讯云开发者
