diff options
Diffstat (limited to 'docs/zh-cn/other_vscode.md')
-rw-r--r-- | docs/zh-cn/other_vscode.md | 122 |
1 files changed, 122 insertions, 0 deletions
diff --git a/docs/zh-cn/other_vscode.md b/docs/zh-cn/other_vscode.md new file mode 100644 index 000000000..e4bca0711 --- /dev/null +++ b/docs/zh-cn/other_vscode.md | |||
@@ -0,0 +1,122 @@ | |||
1 | # 在Visual Studio Code中设置QMK开发环境 | ||
2 | |||
3 | <!--- | ||
4 | original document: 0.15.12:docs/other_vscode.md | ||
5 | git diff 0.15.12 HEAD -- docs/other_vscode.md | cat | ||
6 | --> | ||
7 | |||
8 | [Visual Studio Code](https://code.visualstudio.com/) (VS Code) 是一款支援非常多种不同编程语言的开源编辑器。 | ||
9 | |||
10 | 相比于使用简陋的文本编辑器,形如VS Code这样的多功能编辑器有诸多优势,比如: | ||
11 | * 智能的代码补全 | ||
12 | * 便捷的代码导航 | ||
13 | * 重构工具 | ||
14 | * 自动化构建支持(不再需要命令行操作) | ||
15 | * 图形化的GIT界面 | ||
16 | * 调试器、代码格式化、显示调用层级等多种工具 | ||
17 | |||
18 | 本章节旨在阐述如何配置VS Code以在其上进行QMK固件开发。 | ||
19 | |||
20 | 这份指引提供了在Windows及Ubuntu 18.04下所有的配置方法。 | ||
21 | |||
22 | # 配置VS Code | ||
23 | 一开始,你需要首先确认所有的构建工具已经安装配置完成,且QMK Firmware仓库已拷贝至本地。前往参阅[新人指引](zh-cn/newbs_getting_started.md)确保已完成初始配置。 | ||
24 | |||
25 | ## Windows | ||
26 | |||
27 | ### 依赖项 | ||
28 | |||
29 | * [Git for Windows](https://git-scm.com/download/win) (该链接会自动提示你保存或运行安装包) | ||
30 | |||
31 | 1. 除 `Git LFS (Large File Support)(大文件支援)` 及 `Check daily for Git for Windows updates(每天检查更新)` 外取消所有可选项。 | ||
32 | 2. 将默认编辑器改为 `Use Visual Studio Code as Git's default editor(将VS Code作为默认编辑器)` | ||
33 | 3. 选择 `Use Git from Git Bash only(仅在Git Bash中使用Git)`,这是应使用的方案。 | ||
34 | 4. 在 `Choosing HTTPS transport backend(选择HTTPS传输服务)` 选项上,皆可。 | ||
35 | 5. 选择 `Checkout as-is, commit Unix-style line endings(检出不作更改,提交时使用Unix风格换行符)`,QMK仓库使用的是Unix style提交。 | ||
36 | 6. 在额外选项页,保持默认选择即可。 | ||
37 | |||
38 | 该软件是VS Code支持Git的所需项目,是有可能不去使用它,但直接用它会省很多事。 | ||
39 | |||
40 | * [Git Credential Manager for Windows(Windows版Git凭据管理器)](https://github.com/Microsoft/Git-Credential-Manager-for-Windows/releases) (可选) | ||
41 | |||
42 | 该软件提供了更好的git 凭据加密存储、多因素身份认证(MFA)及私有访问token生成器。 | ||
43 | |||
44 | 这个不是严格必须的,但我们依旧推荐使用。 | ||
45 | |||
46 | |||
47 | ### 安装VS Code | ||
48 | |||
49 | 1. 到[VS Code](https://code.visualstudio.com/)下载安装包 | ||
50 | 2. 运行安装包 | ||
51 | |||
52 | 很简单的操作。然而,仍有一些配置我们需要确保是设置正确的。 | ||
53 | |||
54 | ### VS Code设置 | ||
55 | |||
56 | 首先来配置IntelliSense,虽不是严格必要的,但能让你后续使用便捷**很多**。首先,在QMK Firmware目录下创建文件 `.vscode/c_cpp_properties.json`,之后的操作可以手动完成,但我已经完成了大部分。 | ||
57 | |||
58 | 获取[这份文件](https://gist.github.com/drashna/48e2c49ce877be592a1650f91f8473e8),如果你的MSYS2没有安装在默认路径,或在用WSL/LxSS,你可能需要做一下编辑修改。 | ||
59 | |||
60 | 在保存妥当后,如果你有已打开的VS Code,你需要reload一下。 | ||
61 | |||
62 | ?> 在 `.vscode` 目录下你应该还能看到 `extensions.json` 和 `settings.json` 文件。 | ||
63 | |||
64 | 现在,我们配置MSYS2作为VSCode的集成终端。这么做有很多好处,最主要的是可以通过按住control点击错误消息直接跳转到文件,调试起来会简单得多,另外的好处是,你不用在窗口间切换。 | ||
65 | |||
66 | 1. 点击 <kbd><kbd>文件</kbd> > <kbd>首选项 ></kbd> > <kbd>设置</kbd> </kbd> | ||
67 | 2. 点击上方右侧的 <kbd>{}</kbd> 按钮,打开 `settings.json` 文件。 | ||
68 | 3. 将文件改为: | ||
69 | |||
70 | ```json | ||
71 | { | ||
72 | "terminal.integrated.profiles.windows": { | ||
73 | "QMK_MSYS": { | ||
74 | "path": "C:/QMK_MSYS/usr/bin/bash.exe", | ||
75 | "env": { | ||
76 | "MSYSTEM": "MINGW64", | ||
77 | "CHERE_INVOKING": "1" | ||
78 | }, | ||
79 | "args": ["--login"] | ||
80 | } | ||
81 | }, | ||
82 | |||
83 | "terminal.integrated.cursorStyle": "line" | ||
84 | } | ||
85 | ``` | ||
86 | |||
87 | 如果该文件内已经有一些配置项,将上面的内容粘贴在最外层的花括号内,并用一个逗号将新旧内容分隔开。 | ||
88 | |||
89 | ?> 如果你的MSYS2安装在不同的目录下,你需要将 `terminal.integrated.shell.windows` 更改为你系统中正确的目录。 | ||
90 | |||
91 | 4. 点击Ctrl-<code>`</code> (Grave) 或在 <kbd><kbd>视图</kbd> > <kbd>终端</kbd></kbd> 可以打开终端界面 (`workbench.action.terminal.toggleTerminal` 命令)。如果没有终端它会自动打开一个。 | ||
92 | |||
93 | 终端应启动于工程目录中(即 `qmk_firmware` 目录),之后你可以构建键盘了。 | ||
94 | |||
95 | |||
96 | ## 其它系统 | ||
97 | |||
98 | 1. 到[VS Code](https://code.visualstudio.com/)下载安装包 | ||
99 | 2. 运行安装包 | ||
100 | 3. 搞定 | ||
101 | |||
102 | 是的,确实是搞定了。安装的时候所有所需的路径配置都会被包含进来,在检查当前工程文件并进行IntelliSense解析上表现也会更好。 | ||
103 | |||
104 | ## 插件 | ||
105 | |||
106 | 有一些你可能感兴趣的扩展可以安装:<!-- 老外自己也分不清plugin和extension啊-_-||| --> | ||
107 | |||
108 | * [Git Extension Pack](https://marketplace.visualstudio.com/items?itemName=donjayamanne.git-extension-pack) - 提供了一系列的Git工具可以让你在QMK Firmware中使用Git便捷一些。 | ||
109 | * [EditorConfig for VS Code](https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig) - _[可选]_ - 可以让你的代码更符合QMK规范。 | ||
110 | * [Bracket Pair Colorizer 2](https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer-2) - _[可选]_ - 可以给大括号着色,可以更好地阅读嵌套代码。 | ||
111 | * [GitHub Markdown Preview](https://marketplace.visualstudio.com/items?itemName=bierner.github-markdown-preview) - _[可选]_ - 使得VS Code下的markdown预览更符合Github的效果。 | ||
112 | * [VS Live Share Extension Pack](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare-pack) - _[可选]_ - 这个扩展允许他人访问你的工作区(或反之)进行协作,在你遇到问题需要他人帮助时挺有用。 | ||
113 | * [VIM Keymap](https://marketplace.visualstudio.com/items?itemName=GiuseppeCesarano.vim-keymap) - _[可选]_ - 为那些更喜欢VIM风格的按键操作的人所准备。这样的扩展还有挺多。 | ||
114 | |||
115 | 安装扩展后需要重启VS Code。 | ||
116 | |||
117 | # 配置VS Code下的QMK | ||
118 | 1. 点击 <kbd><kbd>文件</kbd> > <kbd>打开目录</kbd></kbd> | ||
119 | 2. 打开你从Github克隆的QMK固件仓库所在目录。 | ||
120 | 3. 点击 <kbd><kbd>文件</kbd> > <kbd>保存工作区为...</kbd></kbd> | ||
121 | |||
122 | 此时你已完成了在VS Code下编写QMK固件的准备工作。 | ||