如何在vs代码webview扩展开发中导入npm包？
如何在vs代码webview扩展开发中导入npm包？
提问于 2020-04-19 08:42:45
我想使用npm (LatextoMathML)，但是当我在我的when视图上使用它时，它会给我运行扩展时的错误，即:未定义的引用:未定义的包名(LatextoXML)。我用require方法尝试了let / var / const。我想在我的js代码中使用webview函数。
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-04-21 10: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
复制相关文章
相似问题
如何在Chrome扩展中导入npm包
Shopify主题应用扩展导入npm包
在VS代码中，如何停靠Webview开发工具？
如何在开发中测试composer包，如symfony包
寻找类似于VS代码远程开发扩展包的IntelliJ远程开发体验
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
