use launch-editor-middleware

This commit is contained in:
Evan You
2018-01-06 13:12:58 -05:00
parent 7f8b45020c
commit 0496dd86f5
6 changed files with 9 additions and 345 deletions
@@ -1,12 +0,0 @@
const launchEditor = require('./launchEditor')
module.exports = () => {
return function launchEditorMiddleware (req, res, next) {
if (req.url.startsWith('/_open')) {
launchEditor(req.query.fileName, req.query.lineNumber)
res.end()
} else {
next()
}
}
}
@@ -1,321 +0,0 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file at
* https://github.com/facebookincubator/create-react-app/blob/master/LICENSE
*/
const fs = require('fs')
const os = require('os')
const path = require('path')
const chalk = require('chalk')
const shellQuote = require('shell-quote')
const child_process = require('child_process') // eslint-disable-line
function isTerminalEditor (editor) {
switch (editor) {
case 'vim':
case 'emacs':
case 'nano':
return true
}
return false
}
// Map from full process name to binary that starts the process
// We can't just re-use full process name, because it will spawn a new instance
// of the app every time
const COMMON_EDITORS_OSX = {
'/Applications/Atom.app/Contents/MacOS/Atom': 'atom',
'/Applications/Atom Beta.app/Contents/MacOS/Atom Beta':
'/Applications/Atom Beta.app/Contents/MacOS/Atom Beta',
'/Applications/Brackets.app/Contents/MacOS/Brackets': 'brackets',
'/Applications/Sublime Text.app/Contents/MacOS/Sublime Text':
'/Applications/Sublime Text.app/Contents/SharedSupport/bin/subl',
'/Applications/Sublime Text 2.app/Contents/MacOS/Sublime Text 2':
'/Applications/Sublime Text 2.app/Contents/SharedSupport/bin/subl',
'/Applications/Sublime Text Dev.app/Contents/MacOS/Sublime Text':
'/Applications/Sublime Text Dev.app/Contents/SharedSupport/bin/subl',
'/Applications/Visual Studio Code.app/Contents/MacOS/Electron': 'code',
'/Applications/AppCode.app/Contents/MacOS/appcode':
'/Applications/AppCode.app/Contents/MacOS/appcode',
'/Applications/CLion.app/Contents/MacOS/clion':
'/Applications/CLion.app/Contents/MacOS/clion',
'/Applications/IntelliJ IDEA.app/Contents/MacOS/idea':
'/Applications/IntelliJ IDEA.app/Contents/MacOS/idea',
'/Applications/PhpStorm.app/Contents/MacOS/phpstorm':
'/Applications/PhpStorm.app/Contents/MacOS/phpstorm',
'/Applications/PyCharm.app/Contents/MacOS/pycharm':
'/Applications/PyCharm.app/Contents/MacOS/pycharm',
'/Applications/PyCharm CE.app/Contents/MacOS/pycharm':
'/Applications/PyCharm CE.app/Contents/MacOS/pycharm',
'/Applications/RubyMine.app/Contents/MacOS/rubymine':
'/Applications/RubyMine.app/Contents/MacOS/rubymine',
'/Applications/WebStorm.app/Contents/MacOS/webstorm':
'/Applications/WebStorm.app/Contents/MacOS/webstorm'
}
const COMMON_EDITORS_LINUX = {
atom: 'atom',
Brackets: 'brackets',
code: 'code',
emacs: 'emacs',
'idea.sh': 'idea',
'phpstorm.sh': 'phpstorm',
'pycharm.sh': 'pycharm',
'rubymine.sh': 'rubymine',
sublime_text: 'sublime_text',
vim: 'vim',
'webstorm.sh': 'webstorm'
}
const COMMON_EDITORS_WIN = [
'Brackets.exe',
'Code.exe',
'atom.exe',
'sublime_text.exe',
'notepad++.exe',
'clion.exe',
'clion64.exe',
'idea.exe',
'idea64.exe',
'phpstorm.exe',
'phpstorm64.exe',
'pycharm.exe',
'pycharm64.exe',
'rubymine.exe',
'rubymine64.exe',
'webstorm.exe',
'webstorm64.exe'
]
function addWorkspaceToArgumentsIfExists (args, workspace) {
if (workspace) {
args.unshift(workspace)
}
return args
}
function getArgumentsForLineNumber (editor, fileName, lineNumber, workspace) {
const editorBasename = path.basename(editor).replace(/\.(exe|cmd|bat)$/i, '')
switch (editorBasename) {
case 'atom':
case 'Atom':
case 'Atom Beta':
case 'subl':
case 'sublime':
case 'sublime_text':
case 'wstorm':
case 'charm':
return [fileName + ':' + lineNumber]
case 'notepad++':
return ['-n' + lineNumber, fileName]
case 'vim':
case 'mvim':
case 'joe':
case 'emacs':
case 'emacsclient':
return ['+' + lineNumber, fileName]
case 'rmate':
case 'mate':
case 'mine':
return ['--line', lineNumber, fileName]
case 'code':
case 'Code':
return addWorkspaceToArgumentsIfExists(
['-g', fileName + ':' + lineNumber],
workspace
)
case 'appcode':
case 'clion':
case 'clion64':
case 'idea':
case 'idea64':
case 'phpstorm':
case 'phpstorm64':
case 'pycharm':
case 'pycharm64':
case 'rubymine':
case 'rubymine64':
case 'webstorm':
case 'webstorm64':
return addWorkspaceToArgumentsIfExists(
['--line', lineNumber, fileName],
workspace
)
}
// For all others, drop the lineNumber until we have
// a mapping above, since providing the lineNumber incorrectly
// can result in errors or confusing behavior.
return [fileName]
}
function guessEditor () {
// Explicit config always wins
if (process.env.VUE_EDITOR) {
return shellQuote.parse(process.env.VUE_EDITOR)
}
// We can find out which editor is currently running by:
// `ps x` on macOS and Linux
// `Get-Process` on Windows
try {
if (process.platform === 'darwin') {
const output = child_process.execSync('ps x').toString()
const processNames = Object.keys(COMMON_EDITORS_OSX)
for (let i = 0; i < processNames.length; i++) {
const processName = processNames[i]
if (output.indexOf(processName) !== -1) {
return [COMMON_EDITORS_OSX[processName]]
}
}
} else if (process.platform === 'win32') {
const output = child_process
.execSync('powershell -Command "Get-Process | Select-Object Path"', {
stdio: ['pipe', 'pipe', 'ignore']
})
.toString()
const runningProcesses = output.split('\r\n')
for (let i = 0; i < runningProcesses.length; i++) {
// `Get-Process` sometimes returns empty lines
if (!runningProcesses[i]) {
continue
}
const fullProcessPath = runningProcesses[i].trim()
const shortProcessName = path.basename(fullProcessPath)
if (COMMON_EDITORS_WIN.indexOf(shortProcessName) !== -1) {
return [fullProcessPath]
}
}
} else if (process.platform === 'linux') {
// --no-heading No header line
// x List all processes owned by you
// -o comm Need only names column
const output = child_process
.execSync('ps x --no-heading -o comm --sort=comm')
.toString()
const processNames = Object.keys(COMMON_EDITORS_LINUX)
for (let i = 0; i < processNames.length; i++) {
const processName = processNames[i]
if (output.indexOf(processName) !== -1) {
return [COMMON_EDITORS_LINUX[processName]]
}
}
}
} catch (error) {
// Ignore...
}
// Last resort, use old skool env vars
if (process.env.VISUAL) {
return [process.env.VISUAL]
} else if (process.env.EDITOR) {
return [process.env.EDITOR]
}
return [null]
}
function printInstructions (fileName, errorMessage) {
console.log()
console.log(
chalk.red('Could not open ' + path.basename(fileName) + ' in the editor.')
)
if (errorMessage) {
if (errorMessage[errorMessage.length - 1] !== '.') {
errorMessage += '.'
}
console.log(
chalk.red('The editor process exited with an error: ' + errorMessage)
)
}
console.log()
console.log(
'To set up the editor integration, add something like ' +
chalk.cyan('VUE_EDITOR=atom') +
' to the ' +
chalk.green('.env.local') +
' file in your project folder ' +
'and restart the development server. Learn more: ' +
chalk.green('https://goo.gl/MMTaZt')
)
console.log()
}
let _childProcess = null
function launchEditor (fileName, lineNumber) {
if (!fs.existsSync(fileName)) {
return
}
// Sanitize lineNumber to prevent malicious use on win32
// via: https://github.com/nodejs/node/blob/c3bb4b1aa5e907d489619fb43d233c3336bfc03d/lib/child_process.js#L333
if (lineNumber && isNaN(lineNumber)) {
return
}
let [editor, ...args] = guessEditor() // eslint-disable-line
if (!editor) {
printInstructions(fileName, null)
return
}
if (
process.platform === 'linux' &&
fileName.startsWith('/mnt/') &&
/Microsoft/i.test(os.release())
) {
// Assume WSL / "Bash on Ubuntu on Windows" is being used, and
// that the file exists on the Windows file system.
// `os.release()` is "4.4.0-43-Microsoft" in the current release
// build of WSL, see: https://github.com/Microsoft/BashOnWindows/issues/423#issuecomment-221627364
// When a Windows editor is specified, interop functionality can
// handle the path translation, but only if a relative path is used.
fileName = path.relative('', fileName)
}
const workspace = null
if (lineNumber) {
args = args.concat(
getArgumentsForLineNumber(editor, fileName, lineNumber, workspace)
)
} else {
args.push(fileName)
}
if (_childProcess && isTerminalEditor(editor)) {
// There's an existing editor process already and it's attached
// to the terminal, so go kill it. Otherwise two separate editor
// instances attach to the stdin/stdout which gets confusing.
_childProcess.kill('SIGKILL')
}
if (process.platform === 'win32') {
// On Windows, launch the editor in a shell because spawn can only
// launch .exe files.
_childProcess = child_process.spawn(
'cmd.exe',
['/C', editor].concat(args),
{ stdio: 'inherit' }
)
} else {
_childProcess = child_process.spawn(editor, args, { stdio: 'inherit' })
}
_childProcess.on('exit', function (errorCode) {
_childProcess = null
if (errorCode) {
printInstructions(fileName, '(code ' + errorCode + ')')
}
})
_childProcess.on('error', function (error) {
printInstructions(fileName, error.message)
})
}
module.exports = launchEditor
+1 -6
View File
@@ -4,8 +4,7 @@
"description": "error overlay & dev server middleware for vue-cli",
"main": "dist/client.js",
"files": [
"dist",
"middleware"
"dist"
],
"repository": {
"type": "git",
@@ -22,10 +21,6 @@
"url": "https://github.com/vuejs/vue-cli/issues"
},
"homepage": "https://github.com/vuejs/vue-cli/packages/@vue/cli-overlay#readme",
"dependencies": {
"chalk": "^2.3.0",
"shell-quote": "^1.6.1"
},
"publishConfig": {
"access": "public"
}
@@ -40,7 +40,7 @@ module.exports = (api, options) => {
const openBrowser = require('../util/openBrowser')
const prepareURLs = require('../util/prepareURLs')
const prepareProxy = require('../util/prepareProxy')
const overlayMiddleware = require('@vue/cli-overlay/middleware')
const launchEditorMiddleware = require('launch-editor-middleware')
const projectDevServerOptions = options.devServer || {}
const useHttps = args.https || projectDevServerOptions.https || defaults.https
@@ -136,8 +136,12 @@ module.exports = (api, options) => {
https: useHttps,
proxy: proxySettings,
before (app) {
// overlay
app.use(overlayMiddleware())
// launch editor support.
// this works with vue-devtools & @vue/cli-overlay
app.use('/__open-in-editor', launchEditorMiddleware(() => console.log(
`To specify an editor, sepcify the EDITOR env variable or ` +
`add "editor" field to your Vue project config.\n`
)))
// allow other plugins to register middlewares, e.g. PWA
api.service.devServerConfigFns.forEach(fn => fn(app))
// apply in project middlewares
+1 -3
View File
@@ -29,14 +29,13 @@
"copy-webpack-plugin": "^4.3.1",
"cross-spawn": "^5.1.0",
"css-loader": "^0.28.7",
"dotenv": "^4.0.0",
"express-open-in-editor": "^3.1.1",
"extract-text-webpack-plugin": "^3.0.2",
"file-loader": "^1.1.6",
"friendly-errors-webpack-plugin": "^1.6.1",
"get-value": "^2.0.6",
"html-webpack-plugin": "^2.30.1",
"javascript-stringify": "^1.6.0",
"launch-editor-middleware": "^1.0.0",
"minimist": "^1.2.0",
"opn": "^5.1.0",
"optimize-css-assets-webpack-plugin": "^3.2.0",
@@ -46,7 +45,6 @@
"read-pkg-up": "^3.0.0",
"rimraf": "^2.6.2",
"semver": "^5.4.1",
"serve": "^6.4.3",
"string.prototype.padend": "^3.0.0",
"uglifyjs-webpack-plugin": "^1.1.4",
"url-loader": "^0.6.2",