vscode的基础配置大全可收藏

Posted 2020-12-26 dreamcfl

//用户设置

 

{

//-------- 搜索配置 --------

"search.exclude": {

"**/node_modules": true,

"**/bower_components": true,

"**/.git": true,

"**/.DS_Store": true,

"**/*.meta": true,

"**/*.*.meta": true,

"**/*.unity": true,

"**/*.unityproj": true,

"**/*.mat": true,

"**/*.fbx": true,

"**/*.FBX": true,

"**/*.tga": true,

"**/*.cubemap": true,

"**/**.prefab": true,

"**/Library": true,

"**/ProjectSettings": true,

"**/Temp": true,

"**/*.exe": true

},

// 配置 glob 模式以排除文件和文件夹。

"files.exclude": {

"**/.git": true,

"**/.DS_Store": true,

"**/*.meta": true,

"**/*.*.meta": true,

"**/*.unity": true,

"**/*.unityproj": true,

"**/*.mat": true,

"**/*.fbx": true,

"**/*.FBX": true,

"**/*.tga": true,

"**/*.cubemap": true,

"**/**.prefab": true,

"**/Library": true,

"**/ProjectSettings": true,

"**/Temp": true,

"**/*.exe": true

},

// 控制编辑器是否应呈现空白字符

"editor.renderWhitespace": true,

// 控制字体大小。

"editor.fontSize": 18,

// 是否启用了 GIT

"git.enabled": false,

 

"editor.wordWrap": "on",

// 是否应该呈现缩进指南

"editor.renderIndentGuides":true,

// Ctrl + 鼠标滚轴可以缩放视图

"editor.mouseWheelZoom" : true,

// 这样 visual code 就可以调试和运行 python代码了！ 当前了也要安装插件

"python.pythonPath": "E:/Program Files/Python35/python.exe",

// Whether to lint Python files.

"python.linting.enabled": false,

// 打开多个文件的时候 Tab页的方式显示（否则只能是分屏显示）

"workbench.editor.showTabs": true,

// 新打开的显示在最左面

"workbench.editor.openPositioning": "left",

"window.zoomLevel": 1,

"files.autoSave": "afterDelay",

"liveServer.settings.donotShowInfoMsg": true,

"workbench.colorTheme": "Visual Studio Dark",

"explorer.confirmDragAndDrop": false,

// lua 的调试工具 Lua and Ravi 5.3 Debugger https://marketplace.visualstudio.com/items?itemName=ravilang.ravi-debug

// go 插件也有调试功能， 但是要配置具体的环境变量！

//ctrl+space被切换输入法快捷键占用

"files.associations": {"*.vue":"html"}

}

 

配置：

 

常用插件：

View In Browser 
- 预览页面（ctrl+F1）

vscode-icons 
- 侧栏的图标，对于一个有视觉强迫症的人是必须要的

html Snippets 
- 支持HTML5的标签提示

HTML CSS support 
- css自动补齐

jQuery Code Snippets 
jquery 自动提示

Path Autocomplete 
- 路径自动补齐

Npm Intellisense 
- npm包代码提示

ESLint 
- 检测JS必备

Debugger for Chrome 
- 方便调试 
Auto Rename Tag 
- 自动同步修改标签

Bootstrap 3 Snippets 
- bootstrap必备

Vue 2 Snippets 
- vue必备

background 

- 一个萌萌的插件，可以自己设置vsc的背景图

Live Server

服务器

open in Browser 

浏览器打开

Bracket Pair Colorizer

括号颜色匹配

 

vue代码模板

 

{

"Print to console": {

"prefix": "vue",

"body": [

"<script>",

" new Vue({",

" el: ‘#box‘,",

         " data: {",

         " ", 

" },",

" methods: {",

         " greet: function (event) {",

         " ",

" }",

" }",

" })",

"</script>"

],

"description": "Log output to console"

}

}

vue组件代码块