vue.js - Vue 开发工具 - 无法使用“在编辑器中打开”按钮。如何解决这个问题?
问题描述
我正在尝试从教程中设置此功能: https ://github.com/vuejs/vue-devtools/blob/master/docs/open-in-editor.md
但出现错误
"C:\Users\User\AppData\Local\Programs\Microsoft" не является внутренней или внешней, исполняемой программой или пакетным файлом.
Could not open LeadsEdit.vue in the editor.
The editor process exited with an error: (code 1).
To specify an editor, sepcify the EDITOR env variable or add "editor" field to your Vue project config.
在我的 vue.config.js 中(基于 vue cli 3.0 的项目)
const openInEditor = require('launch-editor-middleware');
module.exports = {
configureWebpack: {
devtool: 'source-map',
},
devServer: {
before(app) {
app.use('/__open-in-editor', openInEditor('code'))
}
}
}
UPD。如果没有此代码,问题仍然存在。UPD2。
我正在尝试在 .env 文件中设置 EDITOR 变量
VUE_APP_EDITOR=/c/Users/User/AppData/Local/Programs/Microsoft VS Code/Code.exe
或者使用 vue.config.js
const openInEditor = require('launch-editor-middleware');
module.exports = {
configureWebpack: {
devtool: 'source-map',
},
devServer: {
before(app) {
app.use('/__open-in-editor', openInEditor('/c/Users/User/AppData/Local/Programs/Microsoft VS Code/Code.exe'))
}
}
}
但问题依然存在
什么可能导致这个问题?我该如何解决这个错误?
解决方案
似乎开发工具正在尝试打开编辑器可执行文件C:\Users\User\AppData\Local\Programs\Microsoft
,这很可能是错误的。Windows 10 上的默认安装位置是(据我所知)C:\Users\User\AppData\Local\Programs\Microsoft VS Code\Code.exe
。
launch-editor
尝试从当前运行的进程中找到编辑器并回退到环境变量EDITOR
和VISUAL
(请参阅https://github.com/yyx990803/launch-editor#why),因此您可以将EDITOR
env var 设置为正确的路径。
可能,编辑器配置周围缺少引号,因此它在第一个空格处被截断。我真的不知道路径来自哪里,要么你通过环境变量配置它,要么在你的 vue 项目配置中。
根据您更新的问题中的信息,您可以尝试以下操作:
我不知道变量名
VUE_APP_EDITOR
来自哪里,但我想应该是EDITOR
. 将其更改为EDITOR
,看看会发生什么您使用的路径看起来不对(即不像 Windows 路径)。试试
c:/Users/User/AppData/Local/Programs/Microsoft VS Code/Code.exe
吧。例如:app.use('/__open-in-editor', openInEditor('c:/Users/User/AppData/Local/Programs/Microsoft VS Code/Code.exe'))
cmd
您可以通过启动shell并输入路径来测试路径是否正确。如果正确,VS Code 应该会打开。如果没有,它会告诉你找不到路径。
也看看这个,还有更多关于如何集成 vue devtools & VS Code:https ://gist.github.com/moreta/d3989686b6a1f2416b5802cac8df16b4
推荐阅读
- javascript - 有没有办法离线保存大量图像以便稍后发送到服务器?
- javascript - 如何检查数组值是否具有文件格式
- javascript - 使用文件保护程序 npm 包下载时 xlsx 文件损坏
- swift - Swift macOS 标签渐变文本
- javascript - 有什么方法可以在 Chrome DevTools 中重新分配 const 吗?
- jquery - 如何删除项目物化芯片
- node.js - 如何处理来自 multer 自定义存储的错误?
- javascript - 反应 16.9.0“javascript:;” href替代品?
- php - PHP中的多个文件上传,获取文件索引
- laravel - Laravel 数组验证:在错误消息中使用字段索引