Visual Studio Code工具使用及配置
最近迷上了这个工具,启动速度快,好多插件。唯一不满意的地方就是svn版本控制工具。下面发现我装的一些插件及配置:
我安装的一些插件:


上面是我装的插件,等有时间再解释下插件的作用。
接下来说下配置:
进入设置步骤:

进入设置页面选择工作区设置


这是我的一些设置如下:

附上设置类容:
{
"workbench.startupEditor": "newUntitledFile",
"workbench.editor.enablePreview": false, //打开文件不覆盖
"search.followSymlinks": false, //关闭rg.exe进程
"editor.minimap.enabled": true, //关闭快速预览
"files.autoSave": "off", //打开自动保存
"editor.lineNumbers": "on", //开启行数提示
"editor.quickSuggestions": {
//开启自动显示建议
"other": true,
"comments": true,
"strings": true
},
"editor.tabSize": 2, //每次保存自动格式化
"eslint.autoFixOnSave": true, // 每次保存的时候将代码按eslint格式进行修复
"prettier.eslintIntegration": true, //让prettier使用eslint的代码格式进行校验
"prettier.semi": false, //去掉代码结尾的分号
"prettier.singleQuote": true, //使用带引号替代双引号
"javascript.format.insertSpaceBeforeFunctionParenthesis": true, //让函数(名)和后面的括号之间加个空格
"eslint.validate": [
//开启对.vue文件中错误的检查
"javascript",
"javascriptreact",
{
"language": "html",
"autoFix": true
},
{
"language": "vue",
"autoFix": true
}
],
"explorer.confirmDelete": false,
"files.associations": {
"*.vue": "vue",
"*.html": "html"
},
"emmet.triggerExpansionOnTab": true,
"terminal.integrated.shell.windows": "C:\\Windows\\System32\\cmd.exe"
}
还可以设置用户代码模板。设置如下:

我用这个工具主要做vue开发的,下面分享我vue代码片段

搜vue.json并且打开它。将一下类容粘贴上去保存即可。
{
"Print to console": {
"prefix": "vue",
"body": [
"<template>",
" <div>\n",
" </div>",
"</template>\n",
"<script>",
"export default {",
" props: {\n",
" },",
" components: {\n",
" },",
" watch: {\n",
" },",
" data() {",
" return {\n",
" };",
" },",
" computed: {\n",
" },",
" created() {\n",
" },",
" mounted() {\n",
" },",
" methods: {\n",
" },",
"};",
"</script>\n",
"<style scoped lang=\"${1:scss}\">\n",
"</style>\n"
],
"description": "Create vue template"
}
}
下面测试一下怎么使用:
新建一个vue文件

输入vue,按下enter或者tab键代码生成。

效果如下:

Visual Studio Code工具使用及配置的更多相关文章
- Visual Studio Code IDE开发插件配置
[PHP通用集成环境] PHP Extension Pack #PHP拓展包,PHP开发最重要的拓展 PHP Intelephense #PHP自动补全工具 PHP IntelliSense #PHP ...
- Visual Studio Code 工具使用教程
软件下载这里就不用讲了,安装完之后: 1.切换中文: 选择扩展 搜索“Language”,在下列选项选择 Chinese (Simplified) Language Pack for Visual S ...
- 在Visual Studio Code中配置GO开发环境
一.GO语言安装 详情查看:GO语言下载.安装.配置 二.GoLang插件介绍 对于Visual Studio Code开发工具,有一款优秀的GoLang插件,它的主页为:https://github ...
- Visual Studio Code中配置GO开发环境
在Visual Studio Code中配置GO开发环境 一.GO语言安装 详情查看:GO语言下载.安装.配置 二.GoLang插件介绍 对于Visual Studio Code开发工具,有一款优秀的 ...
- 使用Visual Studio Code开发.NET Core看这篇就够了
作者:依乐祝 原文地址:https://www.cnblogs.com/yilezhu/p/9926078.html 在本文中,我将带着大家一步一步的通过图文的形式来演示如何在Visual Studi ...
- 使用visual studio code调试php代码
这回使用visual studio code折腾php代码的调试,又是一顿折腾,无论如何都进不了断点.好在就要放弃使用visual studio code工具的时候,折腾好了,汗~ 这里把步骤记录下来 ...
- 使用Visual Studio Code开发Asp.Net Core WebApi学习笔记(十)-- 发布(Windows)
本篇将在这个系列演示的例子上继续记录Asp.Net Core在Windows上发布的过程. Asp.Net Core在Windows上可以采用两种运行方式.一种是自托管运行,另一种是发布到IIS托管运 ...
- Create A .NET Core Development Environment Using Visual Studio Code
https://www.c-sharpcorner.com/article/create-a-net-core-development-environment-using-visual-studio- ...
- [一]Cesium利其器——Visual Studio Code
Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ IDE Web前端刚入门的朋友,常常想选择一个快速.好用.流行( ...
随机推荐
- MapTask工作机制
(1)Read阶段:MapTask通过用户编写的RecordReader,从输入InputSplit中解析出一个个key/value. (2)Map阶段:该节点主要是将解析出的key/value交给用 ...
- Can总线上的电平及物理层仲裁
CAN总线采用差分信号传输,通常情况下只需要两根信号线(CAN-H和CAN-L)就可以进行正常的通信.在干扰比较强的场合,还需要用到屏蔽地即CAN-G(主要功能是屏蔽干扰信号),CAN协议推荐用户使用 ...
- rpm命令(转)
rpm -qa|grep mysql rpm命令是RPM软件包的管理工具.rpm原本是Red Hat Linux发行版专门用来管理Linux各项套件的程序,由于它遵循GPL规则且功能强大方便,因而广受 ...
- (1)IdentityServer4 V3.0.2-安装模板
控制台运行命令: dotnet new -i IdentityServer4.Templates
- Redis之eval+lua实现初步
目录 目录 1 1. 前言 1 2. 执行方式 1 3. 执行过程 3 4. 使用原则 3 1. 前言 Redis的实现保证eval的执行是原子的,即使eval执行的lua超时,Redis也不会自动终 ...
- 【jmeter】Include Controller控件&Test Fragment的使用
概念:简单说下Include Controller引用Test Fragment片段 Include Controller控件——给当前jmeter脚本引入外部片段的jmeter脚本(Test Fra ...
- 数据结构(一)二叉树 & avl树 & 红黑树 & B-树 & B+树 & B*树 & R树
参考文档: avl树:http://lib.csdn.net/article/datastructure/9204 avl树:http://blog.csdn.net/javazejian/artic ...
- js - true和false
JavaScript的true和false什么时候会出现,如何优雅的写判断条件? 以下条件为false,也可称为“falsy” - > 虚值 if (false) if (null) if (u ...
- git 相关流程和报错解决
git 相关流程: 预先配置: gitroot $ git config user.name XXXgitroot $ git config user.email XXX@XXX.com git re ...
- S905系列的uboot分析
Ubuntu18.04通过PL2303HX连接TTL 接线的连接 PL2303的3.3V悬空, TX接盒子RX, RX接盒子TX, GND接盒子GND 终端选择 系统自带pl2303的驱动, 可以通过 ...