在VSCode Marketplace 搜素Vue 出现关于语法高亮的插件有 vue,vue-beautify,vue-color,VueHelper,vertur等等。比较了下载数量可以了解到,vetur 是目前比较好的语法高亮插件,我们来安装一下吧。

vscode提高效率有效使用插件

vscode-Document This-----jsdoc注释生成。

vscode-eCSStractor-----抽取页面的class,生成一个css文档。

vscode-CSS Peek------class名字定义跳转。(终于拥有dw cc的这个css定义跳转功能)

vscode-Live Server-----http服务器(相当于使用nodejs的http-server )。

vscode-Change Case-----变量名命名风格切换。(解决了命名风格不统一的工具)

Auto Close Tag                                 自动闭合HTML标签

Auto Rename Tag                                修改HTML标签时,自动修改匹配的标签


Bookmarks                                      添加行书签


Can I Use                                      HTML5、CSS3、SVG的浏览器兼容性检查


Code Runner                                    运行选中代码段(支持大量语言,包括Node)


CodeBing                                       在VSCode中弹出浏览器并搜索,可编辑搜索引擎


Color Highlight                                颜色值在代码中高亮显示


Color Picker                                   拾色器


Document This                                  注释文档生成


EditorConfig for VS Code                  EditorConfig插件


Emoji                                          在代码中输入emoji


ESLint                                         ESLint插件,高亮提示


File Peek                                      根据路径字符串,快速定位到文件


Font-awesome codes for html             FontAwesome提示代码段


ftp-sync                                       同步文件到ftp


Git Blame                                      在状态栏显示当前行的Git信息


Git History(git log)                           查看git log


GitLens                                        显示文件最近的commit和作者,显示当前行commit信息


Guides                                         高亮缩进基准线


Gulp Snippets                                  Gulp代码段


HTML CSS Class Completion            CSS class提示


HTML CSS Support                              css提示(支持vue)


HTMLHintHTML                                  格式提示


Indenticator                                  缩进高亮


JavaScript (ES6) code snippets               ES6语法代码段


language-stylus                           Stylus语法高亮和提示


Lodash                                       Lodash代码段


markdownlint                                 Markdown格式提示


MochaSnippets                            Mocha代码段


Node modules resolve                         快速导航到Node模块


npm                                          运行npm命令


npm Intellisense                             导入模块时,提示已安装模块名称


Output Colorizer                             彩色输出信息


Partial Diff                                 对比两段代码或文件


Path Autocomplete                            路径完成提示


Path Intellisense                            另一个路径完成提示


Prettify JSON                                格式化JSON


Project Manager                        快速切换项目


REST Client                             发送REST风格的HTTP请求


Settings Sync VSCode               设置同步到Gist


String Manipulation                   字符串转换处理(驼峰、大写开头、下划线等等)


Test Spec Generator                         测试用例生成(支持chai、should、jasmine)


TODO Parser                                 Todo管理


Version Lens                                 package.json文件显示模块当前版本和最新版本


vetur                                        目前比较好的Vue语法高亮


View Node Package                           快速打开选中模块的主页和代码仓库


vscode-icons                                文件图标,方便定位文件


VSCode Great Icons                 文件图标拓展


VueHelper                                    Vue2代码段(包括Vue2 api、vue-router2、vuex2)

Quokka.js                                    可以即时显示js和ts的运行结果,想试验一些短代码的运行结果,但是又不想之后删除文件的时候可以用到

codeRunner                                   可以运行C, C++, Java, JavaScript, PHP, Python, Perl, Perl 6, Ruby, Go, Lua, Groovy, PowerShell, BAT/CMD, BASH/SH, F# Script, F# (.NET Core), C# Script,等开发语言并支持局部执行

IntelliSense for CSS class names      智能提示 css 的 class 名

Node.js Modules Intellisense          可以在导入语句中自动完成JavaScript / TypeScript模块。

vscode-faker                           生成假数据,地址,电话,图片等等

Regex Previewer                        测试正则的插件

修正日期:2018-08-06    来源: https://www.qcloud.com/community/article/983896

vue提示插件[vscode]的更多相关文章

  1. vue各种插件汇总

    https://blog.csdn.net/wh8_2011/article/details/80497620(copy) Vue是什么? Vue.js(读音 /vjuː/, 类似于 view) 是一 ...

  2. 二、vue之 使用vscode配置

    vue之 使用vscode配置 visual  studio code 简称vscode,下图为图标 ... 开启vscode ... 1.导入文件夹,选择菜单栏 文件-打开文件夹->选择相应已 ...

  3. vue常用插件汇总

    UI-框架element - 饿了么出品的Vue2的web UI工具套件 mint-ui - Vue 2的移动UI元素 iview - 基于 Vuejs 的开源 UI 组件库 Keen-UI - 轻量 ...

  4. vue 常用插件,保存

    UI组件 element- 饿了么出品的Vue2的web UI工具套件 Vux- 基于Vue和WeUI的组件库 mint-ui- Vue 2的移动UI元素 iview- 基于 Vuejs 的开源 UI ...

  5. chrome浏览器的VUE调试插件Vue.js devtools

      chrome浏览器的VUE调试插件Vue.js devtools 应用商店直接安装 安装成功后在VUE文件打开可以直接调试: 提示效果如下: F12进入调试状态即可: 安装中出现的问题: 插件安装 ...

  6. idea vue提示

    我在idea中,装了,vue.js插件,可就是死活,没有提示,我的html 文件是 .html扩展名,我想是不是因为这个原因,我就新建了个,test.vue,哈哈,提示出来了,我又在其它.html文件 ...

  7. 解决phpStorm使用vue提示"Attribute v-xxx is not allowed here"的问题

    jetbrains家族的新版webStorm.phpStorm等工具都已支持vue,不需要自己再安装Vue.js插件,对vue单文件组件支持挺好.但是在html文件中直接<script>引 ...

  8. electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google JavaScript Style Guide代码规范

    我的electron教程系列 electron教程(一): electron的安装和项目的创建 electron教程(番外篇一): 开发环境及插件, VSCode调试, ESLint + Google ...

  9. 小白学习VUE第二课:环境搭建 VUE Node.js VSCode template模板

    环境搭建 VUE Node.js VSCode template模板: 首先安装node:http://www.runoob.com/nodejs/nodejs-install-setup.html ...

随机推荐

  1. Java开发笔记(一百四十九)引入预报告的好处

    前面介绍了各种SQL语句的调用过程,虽然例子代码写死了每个SQL串,但是完全可以把查询条件作为方法参数传进来.比如现在想删除某个课程的教师记录,那么在编写删除方法时,就把课程名称作为该方法的一个输入参 ...

  2. thinkphp 5.0.24 配置多模块注意的细节

    /*index.php 文件  这一段用于生成模块用 build.php 只能生成诸如 admin hotel 开头为小写字母的模块 如果你设定的 大写开头 如 Hotel Admin 系统就会找不到 ...

  3. UOJ424 Count 生成函数、多项式求逆、矩阵快速幂

    传送门 两个序列相同当且仅当它们的笛卡尔树相同,于是变成笛卡尔树计数. 然后注意到每一个点的权值一定会比其左儿子的权值大,所以笛卡尔树上还不能够存在一条从根到某个节点的路径满足向左走的次数\(> ...

  4. Harbor配置自签名证书,docker login+web https访问,helm chart推送应用

    注:高版本(14以上)docker执行login命令,默认使用https,且harbor必须使用域名,只是用ip访问是不行的. 假设使用的网址是:www.harbor.mobi,本机ip是192.16 ...

  5. java之spring之helloword

    这篇文章主要讲 spring的基础的使用案例 项目整体目录结构: 1.新建一个java项目:spring_helloworld 2.在项目下创建一个lib文件夹,并把一些必须的jar包复制过去 新建l ...

  6. C#——零散学习1

    C#——零散学习1 //结构体(与C语言相似) struct Position { public float x; public float y;         //不一定需要把结构体成员设置为pu ...

  7. Kubernetes Storage Persistent Volumes

    链接:https://kubernetes.io/docs/concepts/storage/persistent-volumes/ 支持的参数,比如mountOptions在这里可以找到 删除正在被 ...

  8. x.append()增加不同维度的区别

    b=np.array([[7,2],[2,4],[3,6],[7,8],[9,10]])print(b)print(type(b)) # 结果显示为nunmpy 数组a=[]for i in rang ...

  9. Java自学-数组 二维数组

    Java 如何使用二维数组 这是一个一维数组, 里面的每一个元素,都是一个基本类型int int a[] =new int[]{1,2,3,4,5}; 这是一个二维数组,里面的每一个元素,都是一个一维 ...

  10. 浏览器Notwork XHR被隐藏了

    图片中红色区域内容被隐藏 解决方式,点击此处