注意:本文发布于 2557 天前,文章中的一些内容可能已经过时。
前几天突然看群里某同学提到了 VS Code,然后发现 VS Code 已经比刚出的时候好了很多,于是我就开始尝试了。先挂个梯子从 官网 那儿下载了下来。
先试了一下,发现 VS Code 与 Sublime Text 相比最大的缺点就是不能同时支持多个文件夹的打开,只能显示某一个文件夹里面的内容,于是我索性把 E 盘拖了进去。
然后发现插件很方便,于是装了一通插件:
- Color Highlight
- ESLint
- Flatland Monokai
- Laravel Blade Snippets
- PHP Debug
- Simple Ruby ERB
- Sublime Text Keymap
然后通读了一遍插件说明和编辑器默认配置文件,做了如下修改:
{
// csslint 规则配置
"css.lint.compatibleVendorPrefixes": "warning",
"css.lint.duplicateProperties": "error",
"css.lint.emptyRules": "error",
"css.lint.zeroUnits": "warning",
// 光标样式
"editor.cursorBlinking": "phase",
"editor.cursorStyle": "line",
// 允许拖放
"editor.dragAndDrop": true,
// 没有选中的文字时复制无效
"editor.emptySelectionClipboard": false,
// 字体设置
"editor.fontFamily": "Consolas, 'WenQuanYi Micro Hei Mono', monospace",
"editor.fontSize": 12,
// 自动格式化(虽然我的代码风格是完全符合格式的,但还是打开吧)
"editor.formatOnType": true,
// 右侧滚动条显示代码缩略图
"editor.minimap.enabled": true,
// 降低一下鼠标滚动的速度
"editor.mouseWheelScrollSensitivity": 0.4,
// 允许 `ctrl+滚轮` 缩放
"editor.mouseWheelZoom": true,
// 显示缩进参考线
"editor.renderIndentGuides": true,
// 不允许越过最后一行继续滚动
"editor.scrollBeyondLastLine": false,
// 每行固定宽度
"editor.wordWrap": "bounded",
"editor.wordWrapColumn": 120,
// 配置 Node.js 目录
"eslint.nodePath": "D:\\DevCache\\npm\\global",
// 配置 eslint
"eslint.options": {
"configFile": "E:\\.vscode\\eslintrc.json"
},
// 保存时执行 eslint
"eslint.run": "onSave",
// 不显示“打开的文件”窗格
"explorer.openEditors.visible": 0,
// 插件自动更新
"extensions.autoUpdate": true,
// 默认行尾为 unix
"files.eol": "\n",
// 这些文件不在左侧显示
"files.exclude": {
"**/.DS_Store": true,
"**/.git": true,
"**/.hg": true,
"**/.svn": true,
"**/$RECYCLE.BIN": true,
"**/node_modules": true
},
// 保存时确保有一个结尾空行
"files.insertFinalNewline": true,
// 去除多余行尾空格
"files.trimTrailingWhitespace": true,
// vscode 内置的 git 不好用,禁用掉
"git.enabled": false,
// 设置 php 路径以便使用 phplint
"php.validate.executablePath": "D:\\PHP\\php.exe",
// 默认的 terminal 改为 git bash
"terminal.external.windowsExec": "D:\\Git\\git-bash.exe",
"terminal.integrated.shell.windows": "D:\\Git\\git-bash.exe",
// 不显示菜单栏
"window.menuBarVisibility": "hidden",
// 如果窗口已退出全屏模式,应还原为全屏模式
"window.restoreFullscreen": true,
// 设置标题栏文字为 `·/path/to/file.ext - Visual Studio Code`
"window.title": "${dirty}${activeEditorLong}${separator}${appName}",
// 隐藏最左边那一排图标(活动栏)
"workbench.activityBar.visible": false,
// 颜色主题
"workbench.colorTheme": "Flatland Monokai",
// 图标主题
"workbench.iconTheme": "vs-seti",
// 禅模式时显示状态栏和标签
"zenMode.hideStatusBar": false,
"zenMode.hideTabs": false
}
此外,虽然 Sublime Text Keymap
已经让 VS Code 有了 Sublime Text 的键位映射,但我还额外修改了几个键位:
[
// 新文件
{ "key": "ctrl+t", "command": "workbench.action.files.newUntitledFile" },
// 下一个标签
{ "key": "ctrl+tab", "command": "workbench.action.nextEditor" },
// 上一个标签
{ "key": "ctrl+shift+tab", "command": "workbench.action.previousEditor" }
]
对于 PHP Debug
,则需要先开启 php_xdebug
扩展,大概的方法就是先搞到一个 php_xdebug.dll
,然后编辑 php.ini
:
zend_extension=php_xdebug.dll
[XDebug]
xdebug.remote_enable = 1
xdebug.remote_connect_back = 1
xdebug.remote_port = 8001
xdebug.scream = 0
xdebug.show_local_vars = 1
xdebug.remote_autostart = 1
然后重启相关服务即可。
基本上是直接适应了新环境,用起来简直爽爆了!