一、安装 launch-editor-middleware 

npm install -d launch-editor-middleware

 二、vue.config.js 配置 launch-editor-middleware 

 配置 devServer  before

const openInEditor = require("launch-editor-middleware");

module.exports = {
  devServer: {
    before(app) {
      /* 编辑器类型 webstorm code */
      app.use("/__open-in-editor", openInEditor(["webstorm", "code"]));
    },
  },
};

这样 open in editor 就可以在编辑器打开当前页面啦

编辑器类型

ValueEditorLinuxWindowsOSX
appcodeAppCode  
atomAtom
atom-betaAtom Beta  
bracketsBrackets
clionClion 
codeVisual Studio Code
code-insidersVisual Studio Code Insiders
emacsEmacs  
ideaIDEA
notepad++Notepad++  
pycharmPyCharm
phpstormPhpStorm
rubymineRubyMine
sublimeSublime Text
vimVim  
visualstudioVisual Studio  
webstormWebStorm

注:

在 .vue 文件中设置 name,Vue Devtools 调试结构更清晰

 

参考:Github:launch-editor

Logo

前往低代码交流专区

更多推荐