VS Code环境及插件

C语言

使用vscode写C语言，首先要下载MinGW安装编译器

但是由于使用MinGW安装编译器实在太慢了，此处建议最好搜索直接下载

然后配置系统环境，右键此电脑-属性-高级系统设置-环境变量，在系统变量里添加编译器的地址，如:C:\MinGW\bin

随后就是配置vscode的环境
首先新建一个文件夹 .vscode，然后建两个文件 launch.json和 tasks.json把以下代码粘贴进去

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
46
{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "(Windows) Launch",
            "type": "cppvsdbg",
            "request": "launch",
            "program": "cmd",
            "preLaunchTask": "echo",
            "args": [
                "/C",
                "${workspaceFolder}/exe/${fileBasenameNoExtension}.exe",
                "&",
                "echo.",
                "&",
                "pause"
            ],
            "stopAtEntry": false,
            "cwd": "${workspaceFolder}\\exe\\",
            "environment": [],
            "externalConsole":true
        },
        {
            "name": "(gdb) Launch",
            "type": "cppdbg",
            "request": "launch",
            "program": "${workspaceFolder}\\exe\\${fileBasenameNoExtension}.exe", // workspacefolder为.vscode所在的文件夹,将要进行调试的程序的路径
            "args": [],
            "stopAtEntry": false,
            "cwd": "${workspaceFolder}\\exe\\",
            "environment": [],
            "externalConsole": true,
            "MIMode": "gdb",
            "miDebuggerPath": "D:\\Program Files\\CodeBlocks\\MinGW\\bin\\gdb.exe",// 自己电脑的gdb
            "preLaunchTask": "echo",//这里和task.json的label相对应
            "setupCommands": [
                {
                    "description": "Enable pretty-printing for gdb",
                    "text": "-enable-pretty-printing",
                    "ignoreFailures": true
                }
            ]
 
        }
    ]
}

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
{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "echo",
            "type": "shell",
            "command": "gcc",
            "args": [
                "-g", 
                "${file}", 
                "-o", 
                "${workspaceFolder}/exe/${fileBasenameNoExtension}.exe",
                "-fexec-charset=GBK"//解决中文乱码
            ]
        }
    ],
    "presentation": {
        "echo": true,
        "reveal": "always",
        "focus": false,
        "panel": "shared", 
        "showReuseMessage": true,
        "clear": false
    }
}

注意事项

  • 记得把 "miDebuggerPath"后的路径改成自己编译器所在的位置
  • 为了看起来好看，我分开exe文件和源码文件，在 launch.json中我把输出放在了exe文件夹中，所以除了 .vscode文件还需要建一个 exe文件夹（当然如果喜欢源码和exe堆在一块那把上面带exe的全删掉就好了应该没有人会喜欢文件夹看起来特别乱吧）
  • 千万不要用中文命名！千万不要用中文命名！！千万不要用中文命名！！！

写HTML

这里强烈推荐两个插件
Live Server和 Preview on Web Server

Live Server配上vscode的自动保存可以实时查看修改的结果，就不用自己再去游览器F5了

而Preview on Web Server可以让你再vscode里面直接预览（就像写markdown一样），再也不用alt tab在vscode和游览器之间换来换去了！

安装好这两个插件后只需要在代码界面右键-Preview on side panel

Java

vscode对于Java的支持简直不要太贴心（比C语言好太多了），当安装好JDK后安装vscode关于Java的插件

然后 Ctrl+Shift+P在框内输入Java-创建Java项目-No build tools创建完成，然后就能直接开写了

当然，开始要记关键词的时候最好用vscode，熟悉了Java后还是更推荐用IDEA

Vue

vue的插件有两个，一个是Vetur，还有一个是 Vue 3 Snippets

Vetur可以在文件中直接打vetur通过提示直接把vue文件应有的框架直接搭出来

另一个插件则有丰富的代码片段

缩进配置

当然，如果仅安装了Vetur是不行的，有可能它的缩进你极难忍受，所以我们需要手动的修改一下配置，在VScode中的settings.json中添加如下配置

1
2
3
4
"vetur.format.scriptInitialIndent": false, // js部分是否有初始缩进
"vetur.format.styleInitialIndent": false, // style部分是否有初始缩进
"vetur.format.options.tabSize": 4, //缩进大小
"vetur.format.options.useTabs": false,

愉快的敲代码

TabOut

在IDEA中，我们打了一个括号/大括号后，写完内容后想让光标跳到右括号后，只需要一个Tab即可移动光标（虽然只有一次）

但是在VScode中，我们无法像IDEA这样方便的移动我们的光标。所以，这个插件就是为了解决这个问题，只要光标在由括号前，我们只需要按下tab，即可移动光标。

Error Lens

想要方便的查看报错吗？Error Lens可以直接在报错行旁边直接提示！

TONGYI Lingma

阿里出品的通义千问孪生产品——通义灵码，作为一款Ai代码补全工具，通义灵码毫无疑问是合格的。免费，不用翻墙，还能直接进行问答，这就足够了！

Latex

在写毕业论文的时候LaTeX可没少折磨我，本人并不是很想用线上的Overleaf（虽然它确实很方便，也不需要操心什么配置），但是在本地使用很显然VScode是一个不二之选。所以在此推荐——LaTeX Workshop

然后我们再到setting.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
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115

"latex-workshop.latex.autoBuild.run": "never",
"latex-workshop.showContextMenu": true,
"latex-workshop.intellisense.package.enabled": true,
"latex-workshop.message.error.show": false,
"latex-workshop.message.warning.show": false,
"latex-workshop.latex.tools": [
    {
        "name": "xelatex",
        "command": "xelatex",
        "args": [
            "-synctex=1",
            "-interaction=nonstopmode",
            "-file-line-error",
            "%DOCFILE%"
        ]
    },
    {
        "name": "pdflatex",
        "command": "pdflatex",
        "args": [
            "-synctex=1",
            "-interaction=nonstopmode",
            "-file-line-error",
            "%DOCFILE%"
        ]
    },
    {
        "name": "latexmk",
        "command": "latexmk",
        "args": [
            "-synctex=1",
            "-interaction=nonstopmode",
            "-file-line-error",
            "-pdf",
            "-outdir=%OUTDIR%",
            "%DOCFILE%"
        ]
    },
    {
        "name": "bibtex",
        "command": "bibtex",
        "args": [
            "%DOCFILE%"
        ]
    }
],
"latex-workshop.latex.recipes": [
    {
        "name": "XeLaTeX",
        "tools": [
            "xelatex"
        ]
    },
    {
        "name": "PDFLaTeX",
        "tools": [
            "pdflatex"
        ]
    },
    {
        "name": "BibTeX",
        "tools": [
            "bibtex"
        ]
    },
    {
        "name": "LaTeXmk",
        "tools": [
            "latexmk"
        ]
    },
    {
        "name": "xelatex -> bibtex -> xelatex*2",
        "tools": [
            "xelatex",
            "bibtex",
            "xelatex",
            "xelatex"
        ]
    },
    {
        "name": "pdflatex -> bibtex -> pdflatex*2",
        "tools": [
            "pdflatex",
            "bibtex",
            "pdflatex",
            "pdflatex"
        ]
    },
],
"latex-workshop.latex.clean.fileTypes": [
    "*.aux",
    "*.bbl",
    "*.blg",
    "*.idx",
    "*.ind",
    "*.lof",
    "*.lot",
    "*.out",
    "*.toc",
    "*.acn",
    "*.acr",
    "*.alg",
    "*.glg",
    "*.glo",
    "*.gls",
    "*.ist",
    "*.fls",
    "*.log",
    "*.fdb_latexmk"
],
"latex-workshop.latex.autoClean.run": "onFailed",
"latex-workshop.latex.recipe.default": "lastUsed",
"latex-workshop.view.pdf.internal.synctex.keybinding": "double-click",

在编译的时候我们最好当然是选用 pdflatex -> bibtex -> pdflatex*2，因为我们需要bibtex来进行引用文章然后再编译，所以最好使用此项一键式搞定。

至于文章引用，可以自行百度（）

Git

Git在VScode中的插件也是有两个，无脑安装就完事了

一个是Git History，另一个是GitLens。一个插件可以查看修改的历史，一个可以在行中显示是谁做的修改，以及对修改的操作等