Visual Studio Code使用笔记

安装 VSCode

  • 因为 vscode 是支持跨平台,多语言,易配置的免费 IDE 工具,所以安装是很简的.我这里以Linux Debian系统为例.

插件与扩展

  • 安装插件也是很简单,当然要确保电脑是可以上网的,选中 VSCode 主窗口按下组合快捷键Ctrl+Shift+P,就会出现下图的界面:

extinstall 输入:Ext就会有自动补全的选项,选择的项如图所示,确认之后就会在左边 Docker 出现一个查询列表,在这里输入一些关键字进行查询,没有安装的插件,会在右下端有绿色高亮显示install安装按钮.如下图所示:
extsearch

C/C++ 工程开发(CMake)

  • 安装了的插件有: - ms-vscode.cpptools - mitaki28.vscode-clang - twxs.cmake - vector-of-bool.cmake-tools - webfreak.debug - ionutvmi.path-autocomplete //路径补全 - christian-kohler.path-intellisense  //路径补全

创建 CMakeLists.txt

  • 首先新建一个空目录,使用 VSCode 打开这个目录,同时我个人喜欢把编译目录也建在这个目录下,名为build.用 VSCode 新建一个名为CMakeLists.txt的文件加入如下基本行:
1
2
3
4
5
6
7
8
9
10
project(chapter3)
cmake_minimum_required(VERSION 3.0)
aux_source_directory(. DIR_ROOT_SRCS)
#下面这三行不是必须,这三行只是为了使用非标准路径的OpenCV库.
include_directories(/fullpath/opencv-build-3.x-qt5/include)
link_directories(/fullpath/opencv-build-3.x-qt5/lib)
find_package(OpenCV 3.4.1 HINTS /fullpath/opencv-build-3.x-qt5)
add_executable(${PROJECT_NAME} ${DIR_ROOT_SRCS})
target_link_libraries(${PROJECT_NAME} ${OpenCV_LIBS})

创建 c_cpp_properties.json 文件

  • 组合快捷键Ctrl+Shift+P输入C/Cpp: Edit Configurations ...确定,就会进入一个新的名为c_cpp_properties.json的文件编辑状态,输入如下内容:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
{
"configurations": [
{
"name": "Linux",
"browse": {
// 这个path是为在开发中自动补齐头文件名
"path": [
"/fullpath/opencv-build-3.x-qt5/include",
"${workspaceFolder}"
],
"limitSymbolsToIncludedHeaders": true
},
"includePath": [
"/fullpath/opencv-build-3.x-qt5/include",
"${workspaceFolder}/**"
],
"defines": [],
"compilerPath": "/usr/bin/clang",
"cStandard": "c11",
"cppStandard": "c++17",
"intelliSenseMode": "clang-x64"
}
],
"version": 4
}

创建 tasks.json 文件

  • 组合快捷键Ctrl+Shift+P输入Tasks: Configure Default Build Tasks,或者从工具栏的Tasks->Configure Default Build Task ...,就会出现一个下拉列表,选择Other,就会进入一个新的名为tasks.json的文件编辑状态,填入如下内容.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
{
"label": "cmake",
"type": "shell",
"command": "cd build && cmake ../",
"group": {
"kind": "build",
"isDefault": true
},
"presentation": {
"echo": true,
"reveal": "always",
"focus": false,
"panel": "shared"
},
"problemMatcher": []
},
{
"label": "make",
"type": "shell",
"command": "cd build && make",
"group": {
"kind": "build",
"isDefault": true
},
"presentation": {
"echo": true,
"reveal": "always",
"focus": false,
"panel": "shared"
},
"problemMatcher": []
}
]
}

创建程序主文件

  • 新建一个名为main.cpp的文件如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
#include <iostream>
#include <opencv2/core.hpp>
#include <opencv2/highgui.hpp>
#include <opencv2/imgproc.hpp>
using namespace std;
using namespace cv;
int main(int argc,char *argv[])
{
cv::Mat srcImage = cv::imread("../../images/hand1.jpg");
cv::imshow("bitwise_add",bitImage);
cv::waitKey(0);
return 0;
}

创建 Debug launch.json

  • 组合快捷键Ctrl+Shift+D 下拉选择Add Configurations...->选择C++(GDB/LLDB),就会进入一个新的名为launch.json的文件编辑状态,文件如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "(gdb) Launch",
"type": "cppdbg",
"request": "launch",
"program": "${workspaceFolder}/build/chapter3",
"args": [],
"stopAtEntry": false,
"cwd": "${workspaceFolder}",
"environment": [],
"externalConsole": true,
"MIMode": "gdb",
//这一行是为了在调试前编译一次工程.
"preLaunchTask": "make",
"setupCommands": [
{
"description": "Enable pretty-printing for gdb",
"text": "-enable-pretty-printing",
"ignoreFailures": true
}
]
},
{
"name": "(gdb) Attach",
"type": "cppdbg",
"request": "attach",
"program": "${workspaceFolder}/build/chapter1",
"processId": "${command:pickProcess}",
"MIMode": "gdb",
"setupCommands": [
{
"description": "Enable pretty-printing for gdb",
"text": "-enable-pretty-printing",
"ignoreFailures": true
}
]
}
]
}

测试运行

  • 现在就可以用组合快捷键Ctrl+Shift+B先运行cmake再运行make就能生成出目标文件了.
  • F9在源文件里下断点,F5运行 GDB 调试.
  • 工程的目录结构如下:
1
2
3
4
5
6
7
8
9
~/opencv_chapter3$ ls -a
. .. build CMakeLists.txt main.cpp .vscode
~/opencv_chapter3$ tree .vscode/
.vscode/
├── c_cpp_properties.json
├── launch.json
└── tasks.json
0 directories, 3 files
  • 显而易见的,在根目录下有一个.vscode的隐藏目录,里面有我刚创建的三个文件.

Python 开发环境

  • 相关的插件: - ms-python.python

创建工程

  • 这里 python 创建工程与上面类似,只是安装完成这个ms-python.python插件,有可能需要手动(如果没有自动)用pip安装一些依赖的 python 库,如:pylint,flake8,autopep8,yapf等,注意:pylint,flake8 开启只能二选一.

相关设置

settings.json

  • 选择解释器,组合快捷键Ctrl+Shift+P,输入Python会列出所有Python相关的设置.选择Python: Selecter Interpreter,选择之后也会在根目录下创建.vscode/settings.json,我的配置如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
{
//这里隐藏一些文件类型,不要让它在explorer上面显示.
"files.exclude": {
"**/.git": true,
"**/.svn": true,
"**/.hg": true,
"**/CVS": true,
"**/*.pyc":true,
"**/.DS_Store": true
},
//这里可以写入一个其它位置的解释器,默认就是/usr/bin/python
"python.pythonPath": "/fullpath/.pyenv/versions/py3dev/bin/python",
"python.autoComplete.extraPaths": [
"/fullpath/.pyenv/versions/py3dev/lib/python3.6/site-packages/",
"/fullpath/opencv-build-3.x-qt5-py3/lib/python3.6/site-packages"
],
"python.linting.flake8Path": "/fullpath/.pyenv/versions/3.6.5/envs/py3dev/bin/flake8",
"python.linting.pylintEnabled": false,
"python.linting.flake8Enabled": true,
"python.formatting.provider": "yapf", //格式化代码组合键: Ctrl+Shift+I
"python.formatting.yapfPath": "/fullpath/.pyenv/versions/3.6.5/envs/py3dev/bin/yapf",
"python.linting.enabled": true,
"python.linting.flake8Args": [
"--ignore=E501,E402,E401"
],
"python.linting.pylintPath": "/fullpath/.pyenv/versions/3.6.5/envs/py3dev/bin/pylint"
}

tasks.json

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
{
"label": "echo",
"type": "shell",
"command": "/fullpath/.pyenv/versions/py3dev/bin/python",
"args": [
"cameo.py" //当前要运行的脚本,也就是__main__ 所在的位置
],
"group": {
"kind": "build",
"isDefault": true
}
}
]
}

安装 Arduino 开发环境

  • Arduino 官方的 IDE 功能什么都好,开源库的下载管理,各种开发板的支持都很完善,就是欠缺编辑功能,如自动补全,函数定义跳转等功能.Choosing The Right Arduino IDE这里有几种其它方式的 ArduinoIDE 的实现.
    这里我就选取VS Code插件方式.它的安装方式都很简单如下:

  • Open VS Code and press F1 or Ctrl + Shift + P to open command palette, select Install Extension and type vscode-arduino.  Or launch VS Code Quick Open (Ctrl + P), paste the following command, and press enter.

1
ext install vscode-arduino
  • 使用方法与配置,直接参照vscode-arduino插件的Details描述就行了.注意要正确配置arduino.path的路径,我这里就直接指向 Arduino 官方 IDE 的目录,这样vscode就可以完全找到该系统安装的库与开发板的支持了.settings.json文件可以设置成全局用户配置,也可以设置成单独工程配置,放在工程目录.vscode下面.

### .vscode/settings.json

1
2
3
4
5
6
7
8
9
{
"arduino.path": "C:/Program Files (x86)/Arduino",
"arduino.commandPath": "run-arduino.bat",
"arduino.additionalUrls": "",
"arduino.logLevel": "info",
"arduino.enableUSBDetection": true,
"arduino.disableTestingOpen": false,
"arduino.skipHeaderProvider": false,
}

.vscode/arduino.json under the workspace.

1
2
3
4
5
6
7
8
{
"sketch": "example.ino",
"port": "COM5",
"board": "adafruit:samd:adafruit_feather_m0",
"output": "../build",
"debugger": "jlink",
"prebuild": "bash prebuild.sh"
}

.vscode/c_cpp_properties.json

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
{
"configurations": [
{
"name": "Linux",
"includePath": [
"/fullpath/Arduino/libraries/Adafruit_SSD1306",
"/fullpath/Arduino/libraries/Adafruit_GFX_Library",
"/fullpath/.arduino15/packages/arduino/hardware/sam/1.6.11/cores/arduino",
"${workspaceFolder}/**"
],
"defines": [],
"compilerPath": "/usr/bin/clang",
"cStandard": "c11",
"cppStandard": "c++17",
"intelliSenseMode": "clang-x64",
"browse": {
"limitSymbolsToIncludedHeaders": false,
"path": [
"/fullpath/Arduino/libraries/Adafruit_GFX_Library",
"/fullpath/Arduino/libraries/Adafruit_SSD1306",
"/fullpath/Arduino/libraries/STM32duino_LwIP/src",
"/fullpath/arduino-1.8.3/hardware/arduino/avr/cores/arduino",
"/fullpath/arduino-1.8.3/hardware/arduino/avr/libraries/SPI/src",
"/fullpath/.arduino15/packages/arduino/hardware/sam/1.6.11/cores/arduino"
]
}
}
],
"version": 4
}

总结

  • 这里只是关于VSCode的最基本使用流程,后续会加上其它语言,其它平台的使用笔记进来.初步使用的感觉与效率都很适合我,我以前使用的Qt Creator时间比较长,总体来讲,使用难度曲线不高.

谢谢支持

  • 微信二维码: