配置 VScode

配置 VScode

一、前言

上周六因为电脑系统升级，把我的 vscode 配置全删了（哭了），又要重新配置，有些地方忘了，花了一点时间，所以干脆整理出一份文档，下次配置时按照这份文档来配置就好了。

二、运行 PHP

1. 安装 PHP Intelephense 插件；
2. 安装 code run 插件。（在安装完成并配置好环境变量后，忘记重启 vscode，导致控制台输出一直显示乱码，参考：在vscode运行PHP，使用code run 插件，使用及问题解决 ）

三、open php in browser 插件配置

插件配置

• 设置Open-PHP-HTML-JS-in-browser: Custom Url To Open的值为http://localhost:端口/${relativeFile}
• 设置Open-PHP-HTML-JS-in-browser: Document Root Folder的值为你网站域名的根目录，例如:C:\xampp\htdocs\
• 选择Open-PHP-HTML-JS-in-browser: Url To Open的custom

我的 vscode 的设置为：

• Custom Url To Open：http://localhost/${fileBasename}；
• Document Root Folder：D:\PhpStudy\PHPTutorial\WWW；

四、配置 Markdown

参考：使用VS Code插件打造完美的MarkDown编辑器（插件安装、插件配置、markdown语法）

五、快速生成 html 骨架

参考：解决Vscode 快捷键 ! +tab 无法生成html骨架问题

六、配置快捷键

参考：【VScode】vscode设置快捷键控制光标移动（替代上下左右）

打开快捷键设置的 json 文件

快捷键设置：

// 将键绑定放在此文件中以覆盖默认值
[
    {
        "key":"ctrl+l",
        "command":"cursorRight",
        "when": "textInputFocus"
    },
    {
        "key":"ctrl+j",
        "command":"cursorLeft",
        "when": "textInputFocus"
    },
    {
        "key":"ctrl+i",
        "command":"cursorUp",
        "when": "textInputFocus"
    },
    {
        "key":"ctrl+k",
        "command":"cursorDown",
        "when": "textInputFocus"
    },
    {
        "key":"ctrl+alt+l",
        "command":"cursorRightSelect",
        "when": "textInputFocus"
    },
    {
        "key":"ctrl+alt+j",
        "command":"cursorLeftSelect",
        "when": "textInputFocus"
    },
    {
        // 光标跳到行的开头
        "key":"ctrl+y",
        "command":"cursorLineStart",
        "when": "textInputFocus"
    },
    {
        // 光标跳到行的末尾
        "key":"ctrl+u",
        "command":"cursorLineEnd",
        "when": "textInputFocus"
    },
    {
        // 选中右边的单词（增加颗粒度）
        "key":"ctrl+alt+p",
        "command":"cursorWordRightSelect",
        "when": "textInputFocus"
    },
    {
        // 选中左边的单词（增加颗粒度）
        "key":"ctrl+alt+o",
        "command":"cursorWordLeftSelect",
        "when": "textInputFocus"
    },
    {
        //向上选择列
        "key":"ctrl+alt+i",
        "command":"cursorColumnSelectUp",
        "when": "textInputFocus"
    },
    {
        //向下选择列
        "key":"ctrl+alt+k",
        "command":"cursorColumnSelectDown",
        "when": "textInputFocus"
    },
]

参考资料

1. 在vscode运行PHP，使用code run 插件，使用及问题解决
2. 使用VS Code插件打造完美的MarkDown编辑器（插件安装、插件配置、markdown语法）
3. vscode设置在php在浏览器打开
4. vscode 如何通过快捷键操作光标
5. 【VScode】vscode设置快捷键控制光标移动（替代上下左右）
6. VSCode 设置快捷键 实用配置
7. 解决Vscode 快捷键 ! +tab 无法生成html骨架问题