精华内容
下载资源
问答
  • vscode代码颜色插件
    万次阅读
    2018-10-11 10:22:00
    vue提示插件【Vscode】
          编者寄语:vscode的确是前端开发中很好的工具,安装颜色插件,从视觉上是美的享受。曾经的我遇到了vscode代码全是灰色,黑色的困惑,后来整理找到方法,整理这篇,以下高亮插件,建议大家都安装了。

              在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 )。

    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   测试正则的插件


    转载于:https://www.cnblogs.com/fron-tend/p/9770957.html

    更多相关内容
  • vscode的确是前端开发中很好的工具,安装颜色插件,从视觉上是美的享受。这篇文章主要介绍了vscode中vue代码颜色插件 ,需要的朋友可以参考下
  • Vscode中vue代码颜色插件

    千次阅读 2022-05-03 13:22:38
      vscode的确是前端开发中很好的工具,初始的vscode代码全是灰色,黑色。需要安装颜色插件,从视觉上是美的享受。    在VSCode Marketplace 搜素Vue 出现关于语法高亮的插件有 vue,vue-beautify,vue-color,...

      vscode的确是前端开发中很好的工具,初始的vscode代码全是灰色,黑色。需要安装颜色插件,从视觉上是美的享受。

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

    1、打开Vscode

    在这里插入图片描述

    2、安装成功后重启Vscode即可

    在这里插入图片描述

    展开全文
  • vscode怎么实现代码的高亮颜色插件

    万次阅读 2021-10-18 11:50:09
    vscode怎么实现代码的高亮颜色插件 首先需要安装扩展插件:vetur实现代码高亮. 如果不成功设置调整一下: 打开文件——首选项——设置直接搜索vetur——vetur,进入到 settings.json文件编辑之中,将以下代码复制进去...

    vscode怎么实现代码的高亮颜色插件

    首先需要安装扩展插件:vetur实现代码高亮.
    在这里插入图片描述

    在这里插入图片描述

    如果不成功设置调整一下:
    打开文件——首选项——设置直接搜索vetur——vetur,进入到 settings.json文件编辑之中,将以下代码复制进去:

    {
     // 强制单引号
     "prettier.singleQuote": true,
     // 尽可能控制尾随逗号的打印
     "prettier.trailingComma": "all",
     // 开启 eslint 支持
     "prettier.eslintIntegration": true,
     // 保存时自动fix
     "eslint.autoFixOnSave": true,
     // 添加 vue 支持
     "eslint.validate": [
      "javascript",
      "javascriptreact",
      {
       "language": "vue",
       "autoFix": true
      }
     ],
     // 使用插件格式化 html
     "vetur.format.defaultFormatter.html": "js-beautify-html",
     // 格式化插件的配置
     "vetur.format.defaultFormatterOptions": {
      "js-beautify-html": {
       // 属性强制折行对齐
       "wrap_attributes": "force-aligned"
      }
     },
     "vetur.format.defaultFormatter": {
         "html": "prettier",
         "css": "prettier",
         "postcss": "prettier",
         "scss": "prettier",
         "less": "prettier",
         "js": "prettier",
         "ts": "prettier",
         "stylus": "stylus-supremacy"
     },
     // html颜色高亮
     "files.associations": {
         ".eslintrc": "json",
         "*.vue": "html"
     },
     "emmet.syntaxProfiles": {
         "javascript": "jsx",
         "vue": "html",
         "vue-html": "html"
     }
    }
    

    然后就实现了代码高亮等需要的功能了。

    改变VS code的字体大小的方法:

    1. 打开vscode软件,左上角有一个文件,点击首选项,选择设置。如图:
      在这里插入图片描述

    2. 在常用设置中有一项“以像素为单位控制字体大小",修改为自己想要的字号。点击左边空白处即可
      在这里插入图片描述

    展开全文
  • VSCode插件推荐

    千次阅读 2022-04-10 21:27:53
    1. VSCode汉化包插件 :Chinese (Simplified) (简体中文) Language VSCode汉化包,原始默认是英文的所以我们需要下一个中文插件。 2.VSCode自动补全标签:Auto Close Tag Auto Close Tag对Html或Xml文件自动创建...

    1. VSCode汉化包插件 :Chinese (Simplified) (简体中文) Language 

      VSCode汉化包,原始默认是英文的所以我们需要下一个中文插件。

    2. VSCode自动补全标签 :Auto Close Tag

      Auto Close Tag 对Html或Xml文件自动创建结束标签;

    如在Html中输入div:

     敲回车显示:

    3. VSCode 自动同步修改前后标签名插件:Auto Rename Tag

    修改前面标签后面跟着修改:

    4. VSCode背景图片修改插件:background

    可以自己设置自己喜欢的图片,还可以更改样式,但是最多只能放三张。

    如需更改图片须:下载插件(记得重启软件)>点击左上角文件>首选项>设置>搜索background>在settings.json中编辑

     代码已写好,复制把之前的删掉,然后粘贴改路径即可:

    {
    
        "background.enabled": true,
    
        "background.useDefault": false,
    
      
    
        "background.customImages": [
    
    
    
        // 图片路径 最多三个(哪个盘下面的哪一个文件夹下面的图片)
    
        "file:///",
    
        "file:///",
    
        "file:///",
    
        ],
    
        // 图片样式修改
    
        "background.style": {     
    
        "content": "''",
    
        "pointer-events": "none",
    
        "position": "absolute",
    
        "z-index": "99999",
    
        "width": "200px",
    
        "height": "400px",
    
        "background-size": "contain",
    
        "border-radius": "50px",
    
        "background-repeat": "no-repeat",
    
        "right":"10px",
    
        "top":"280px",
    
        "opacity": 0.4,
    
        },
    
        "bracket-pair-colorizer-2.depreciation-notice": false,
    
        // 下面默认你选择的颜色主题,重启软件会自动更换
    
        "workbench.colorTheme": "GitHub Dark Default",
    
        }

    5. VSCode为代码中括号添加颜色插件:Bracket Pair Colorizer 2

    代码越敲越多,各式各样的括号也很多,有了它以后不仅方便看代码,而且也方便找错,效果图如下:

    6. VSCode很快从Html转到css定义里面的插件:CSS Peek

    它可以让你快速从Html中的查到Css里面定义的标签,鼠标右击标签名快速转到定义:

    7. VSCode颜色主题:GitHub Theme

    根据个人选择,颜色主题很多 但是目前我使用的是这种,感觉不刺眼还阔以;

    里面有Default light 、Default dark 、Dark dimmed三种色可选。

    8. VSCode智能提示样式插件:HTML CSS Support

    在 html 标签上写class 时智能提示当前项目所支持的样式

    9. VSCode快速生成Html标签模板插件:HTML Snippets

    shift+!敲tab或者回车可以自动生成html5标签模板,样式如下:

    <!DOCTYPE html>
    
    <html lang="en">
    
    <head>
    
        <meta charset="UTF-8">
    
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
    
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    
        <title>Document</title>
    
    </head>
    
    <body>
    
       
    
    </body>
    
    </html>

    10. VSCode自动化格式插件:JS-CSS-HTML Formatter

    这个插件对于小白很好用,因为一开始写代码会很乱,看的眼花缭乱,如果下了这个插件每次按ctrl+s保存后代码会自动排版,会比较整齐。

    没用前:

    用之后:

    11. VSCode设置默认浏览器打开html的插件:open in browser

    这个插件可以设定我们默认在哪一个浏览器中打开HTML,下次就直接用默认设置的浏览器打开了;

     上面是默认打开,下面是设置更换浏览器打开。

    12. VSCode快速找到当前目录下的文件插件:Path Intellisense

     在路径里面输入 ./ 会提示当前目录的文件名,方便我们快速找到我们需要的文件。

    建议:下载实用的插件,插件过多会占C盘内存。

    展开全文
  • 自定义 vscode代码颜色

    千次阅读 2021-11-02 17:50:01
    VSCode自定义配色方案 - garvenc - 博客园
  • 一些提高开发效率的VSCode必备插件(分享)提高开发效率的虚拟代码的一些重要插件(分享),本文推荐一些VSCode插件来提高效率。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有帮助。Visual Studio Code插件...
  • vscode插件推荐注释颜色插件名称

    千次阅读 2021-08-29 16:40:56
    描述 :vscode插件推荐注释颜色插件名称 名称: Bookmarks
  • vscode插件vscode插件

    2021-01-04 21:58:49
    vscode插件 自用js 编写 加代码注释 vscode插件
  • VS code代码颜色插件

    万次阅读 2020-05-18 11:37:14
    VS code代码颜色插件 插件名称 使用这个插件可以让代码函数的每个括号的颜色都对应起来,方便寻找函数体
  • vscode代码截图插件Polacode

    万次阅读 2020-07-18 12:28:30
    今天介绍一款在vscode中对代码截图的插件——polacode, 安装插件: 选择polacode-2020 安装即可。 使用: 打开代码编辑页面,然后按"ctrl+shift+p",输入polacode、回车即可。接下来,选中代码,就会生成对应...
  • vscode设置代码不同颜色提示
  • vscode 推荐插件汇总(提高代码效率)

    千次阅读 多人点赞 2021-03-30 15:48:30
    由于个人喜欢使用vscode,所以总结一些实用的插件 汉化 Chinese 新手必备 安装完之后重新打开就是汉语了 云同步 IDE软件环境配置的配置以往是开发人员更换电脑后必须要做的事情,或者需要使用多台电脑工作室时往往...
  • VScode代码截图插件CodeSnap

    千次阅读 2022-08-06 21:52:20
    可以是任何有效的CSS颜色。可以是任何有效的CSS框阴影。代码段容器边缘的填充。可以是任何有效的CSS填充。显示或隐藏窗囗标题栏上的文件夹或文件名。从文件的实际行号开始的布尔值,而不是1。显示或隐藏OSX样式窗囗...
  • 编者寄语:vscode的确是前端开发中很好的工具,安装颜色插件,从视觉上是美的享受。曾经的我遇到了vscode代码全是灰色,黑色的困惑,后来整理找到方法,整理这篇,以下高亮插件,建议大家都安装了。在VSCode ...
  • VS Code 插件推荐(亲自试用过)

    千次阅读 2018-11-14 14:59:11
    1、Color Highlight (用于标识代码颜色色值) 2、Auto Rename Tag(用于HTML标签修改,前后识别) 3、Bracket Pair Colorizer (用于颜色识别匹配括号) 4、Egg Tools and eggjs (nodeJS ...
  • vscode插件收集

    千次阅读 2020-12-23 12:08:59
    Quokka.jsQuokka.js 是一个用于 JavaScript 和 TypeScript 的实时运行代码平台。 这意味着它会在你输入后立即运行您的代码,并在您的代码编辑器中显示各种执行结果。 建议你亲自尝试一下。安装此扩展后,可以按 Ctrl...
  • 代码编辑神器--VSCode插件

    千次阅读 2021-12-18 23:38:34
    代码编辑神器–VSCode插件 Visual Studio Code(简称VS Code)是一个由微软开发,同时支持Windows 、Linux 和 macOS 等操作系统的免费代码编辑器,在2019年的Stack Overflow组织的开发者调研中,VS Code被认为是最...
  • vscode好用插件大全

    2021-12-10 21:18:41
    1.auto close tag ... 2.Auto Rename Tag ...这是一个修改标签对的插件 ...在其中添加条目auto-rename-tag.activationOnLanguage以设置扩展名将被激活的语言。...给括号加上不同的颜色,便于区分不同的区块,使用者..
  • VSCode常用插件

    2022-07-28 10:49:14
    VSCode常用插件
  • 原来是这样的,选中的代码有浅浅的颜色,但是难以识别 我们可以重新设置选中的代码颜色 下面的图是不是对比度很高 步骤 1. 打开VSCODE的设置界面,在右上角打开settings.json,见图第一个按钮。 ...
  • 记录我学习开发VS Code插件的过程,实现一个能自动补全颜色代码插件
  • VScode修改颜色主题(背景+代码

    千次阅读 2021-11-12 09:35:39
    1、打开右下角齿轮图标(设置) 2、选择颜色主题 “Color Theme” 3、上下键预览各种主题效果 推荐两种:浅色+(默认浅色) 深色+(默认深色),主题简洁,并且代码中变量的使用有颜色
  • vscode编辑器插件
  • git 文件标识,修改vscode代码颜色,vscode文件夹变色,变成绿色 本篇主要写了在vscode里修改代码颜色,vscode文件夹变成绿色,文件夹变色,vscode修改代码颜色(VSCode 设置注释的颜色为绿色),git 文件标识,...
  • VSCode 必装的 10 个高效开发插件

    千次阅读 2020-12-30 12:00:39
    本文介绍了目前前端开发最受...VSCode(Visual Studio Code)是由微软研发的一款免费、开源的跨平台文本(代码)编辑器,算是目前前端开发几乎完美的软件开发工具。1. VSCode 的基本使用视频教程在我们的知识星球社区...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 6,641
精华内容 2,656
关键字:

vscode代码颜色插件

友情链接: dihplay.rar