Vue开发工具-不起作用“在编辑器中打开”按钮。如何解决这个问题?

时间:2018-10-11 12:06:24

标签: vue.js vue-cli-3 vue-devtools

我正在尝试通过教程设置此功能: 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'))
        }
    }
}

但是问题仍然存在

什么可能导致此问题? 如何解决此错误?

1 个答案:

答案 0 :(得分:1)

似乎开发人员工具正在尝试打开编辑器可执行文件C:\Users\User\AppData\Local\Programs\Microsoft,这很可能是错误的。据我所知,Windows 10的默认安装位置为C:\Users\User\AppData\Local\Programs\Microsoft VS Code\Code.exe

launch-editor尝试从当前正在运行的进程中查找编辑器,并回退到环境变量EDITORVISUAL(请参阅https://github.com/yyx990803/launch-editor#why),因此您可以设置EDITOR环境变量到正确的路径。

编辑器配置中可能缺少引号,因此它在第一个空格处被切断。我真的不知道路径是从哪里来的,无论是通过环境变量还是在vue项目配置中进行了配置。

根据您更新的问题中的信息,您可以尝试以下操作:

  1. 我不知道变量名VUE_APP_EDITOR的来源,但我想它应该是EDITOR。将其更改为EDITOR,然后查看会发生什么情况

  2. 您使用的路径看起来不正确(即不像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代码的信息:https://gist.github.com/moreta/d3989686b6a1f2416b5802cac8df16b4