精华内容
下载资源
问答
  • VSCode自定义配色文件

    2018-11-08 09:58:09
    目前在使用的一种配色方案,只要将该文件复制到VSCode主体文件目录中($RELEASE/resources/app/extensions),以theme-开头的目录即为颜色主题配置 打开vscode,按键选择ctrl+k,ctrl+t,选择Monokai-My即可切换...
  • VSCode使用

    万次阅读 2018-10-26 16:10:45
    安装Visual Studio Code(vscode) 插件: 1.Chinese 2.主题 Super One Dark Theme 3.插件 luaide、Lua Beautify(快速格式化你的代码格式,让你在编写代码时杂乱的代码结构瞬间变得非常规整) ESLint(语法规则...

    一.安装Visual Studio Code(vscode)

    插件:

    1.Chinese

    2.主题

    Super One Dark Theme

    3.插件

    luaide、Lua

    Beautify(快速格式化你的代码格式,让你在编写代码时杂乱的代码结构瞬间变得非常规整)

    ESLint(语法规则和代码风格的检查工具)

    万能语言运行环境 Code Runner,通过此插件就可以直接运行对应语言的代码

    代码拼写检查 Code Spell Checker

     

     

    二.配置luach.json

    1.工程文件夹直接拖入vscode即可

    2.左侧栏调试图标->设置->选择LuaDebug,这时会出现launch.json文件

    3.在launch.json文件中找到exePath字段修改到模拟器路径

    例如:"exePath": "D:/xxx/player-3.x/player3.exe",

    其他地方配置默认就可以。

    三.lua断点调试配置

        1.下载LuaDebug.lua这个文件

          地址: https://github.com/k0204/LuaIde

    2.把LuaDebug.lua文件放在工程src目录下

    3..调试代码添加

            在main.lua文件中添加以下代码:

                local breakInfoFun,xpcallFun = require("LuaDebug")("localhost", 7003)

               

                --3.x

                --1.断点定时器添加

                cc.Director:getInstance():getScheduler():scheduleScriptFunc(breakInfoFun, 0.3, false)

                --2.程序异常监听

                function G__TRACKBACK(errorMessage)

                debugXpCall();

                print("----------------------------------------")

                local msg = debug.traceback(errorMessage, 3)

                print(msg)

                print("----------------------------------------")

                end

                local status, msg = xpcall(main, G__TRACKBACK)

                --如果是2.x

                CCDirector:sharedDirector():getScheduler():scheduleScriptFunc(breakInfoFun, 0.3, false)

                function G__TRACKBACK(errorMessage)

                debugXpCall();

                print("----------------------------------------")

                local msg = debug.traceback(errorMessage, 3)

                print(msg)

                print("----------------------------------------")

                end

                local status, msg = xpcall(main, G__TRACKBACK)

    四.调试:

    1.按F5启动调试

    调试一旦启动,编辑器顶部就会显示出调试命令栏

    继续 / 暂停 F5

    跳过 F10

    进入 F11

    退出 Shift+F11

    重新开始 unassigned

    停止调试 Shift+F5

    2.单击VS Code左侧视图栏的调试图标即可打开调试视图。

    3.一些调试小技巧

    1变量区域不单能直观看到值,也可以直接编辑变量值调试,或者通过鼠标悬停在编辑器中的源码上编辑。

    2想要一直跟踪某个变量,可以编辑那个变量到监视里。

    3利用调用堆栈,可以知道当出错函数被谁调用的时候出错。这样一层层的看上去,有时可以猜测出错误的原因。

    4在源代码不可得但是函数名称已经知晓的情况下,可以通过按断点区域头部的+来创建断点函数。

     

    五.编辑用户代码片段(Snippets)

    菜单栏->文件->首选项->用户代码片段->lua

    参数解释:

    prefix      :这个参数是使用代码段的快捷入口,比如这里的log在使用时输入log会有智能感知.

    body        :这个是代码段的主体.需要设置的代码放在这里,字符串间换行的话使用\r\n换行符隔开.注意如果值里包含特殊字符需要进行转义.

            多行语句的以,隔开。

    $1          :这个为光标的所在位置.

    $2          :使用这个参数后会光标的下一位置将会另起一行,按tab键可进行快速切换,还可以有$3,$4,$5.....

    description :代码段描述,在使用智能感知时的描述



    作者:fjxiao
    链接:https://www.jianshu.com/p/61152eeee4cc
    來源:简书
    简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

    展开全文
  • vscode用法

    2019-09-26 20:44:54
    vscode是一个值得花费时间去掌握精通的编辑器。 好文档不必远求 打开vscode,把菜单看上三遍,仔细思考每个菜单项的作用,思考为啥要这样归类每个菜单项。 配置是系统的核心 "文件/首选项"这个菜单至关重要,它包括...

    工欲善其事,必先利其器。vscode是一个值得花费时间去掌握精通的编辑器。

    好文档不必远求

    打开vscode,把菜单看上三遍,仔细思考每个菜单项的作用,思考为啥要这样归类每个菜单项。

    配置是系统的核心

    "文件/首选项"这个菜单至关重要,它包括如下四大块配置功能:

    • 设置
    • 快捷键
      快捷键设置分为两类:1)系统提供的菜单项的快捷键;2)使用现有的keymap映射,如vim、idea、sublime等流行编辑器
      vscode的快捷键必然是从快捷键到command的映射,而command并不是可执行文件,而是可以在ctrl+shift+p中看到的命令。
    • 代码片段snippets
      snippets是一些代码片段,这些代码片段可以通过前缀来触发。可以给不同的语言设置不同的代码片段,下面的文件就是给java设置的代码片段。
    {
        "sout": {
            "prefix": "sout",
            "body": [
                "System.out.println($1);",
                "$2"
            ],
            "description": "打印"
        },
        "cla": {
            "prefix": "class",
            "body": [
                "public class $1 {\n\t$2\n}"
            ],
            "description": "定义类"
        },
        "main": {
            "prefix": "main",
            "body": [
                "public static void main(String[]args){\n\t$1\n}"
            ],
            "description": "定义main函数"
        }
    }

    prefix就是触发条件,body就是插入的代码片段,description是一些提示性内容。在body中可以使用$数字的形式表示光标位置,使用tab键可以逐个到达$数字所在的位置。

    • 主题:包括整体样式主题和文件图标主题两部分。样式主题有浅色、深色、高对比度三大类,每个大类又包含若干小类。

    牢记常用快捷键

    ctrl+P:打开文件
    ctrl+shift+P:打开命令面板,这个快捷键堪称最有用的快捷键。快捷键的缺点在于1)键少容易冲突;2)难于记忆。使用命令面板,我们只需要记忆简短的命令,既快又准。
    ctrl+shift+E:打开文件资源管理器(Exploerer)
    ctrl+shift+D:打开调试窗口(Debug)
    ctrl+shift+G:代开Git窗口
    ctrl+shift+X:打开包管理工具
    ctrl+B:隐藏侧边栏
    ctrl+`:打开控制台

    把界面布局中无关的视图全部关闭,当需要某些视图时使用快捷键调出。

    vscode相关的目录

    /Program Files/Microsoft VS Code

    vscode默认的安装位置。

    • bin:一些命令
    • locale:一些语言包
    • resources:包括vscode自带的插件,界面所需要的一些资源,vscode所需要的其它node模块(vscode是用nodejs运行的)
    • 其它文件是一些动态链接库和exe

    .vscode

    每个打开的文件夹都可以有单独的配置,存放在.vscode中,主要包括launch.json、tasks.json、settings.json,分别是调试器设置、任务设置、项目本身的设置(会覆盖全局的settings.json)。

    ~/.vscode

    在~/.vscode目录下,extensions存放了已安装的扩展,想要学习如何编写扩展,直接看这个文件夹就可以了。

    ~/AppData/Roaming/Code

    在~/AppData/Roaming/Code下,文件夹包括备份、缓存、日志、cookie、用户配置等信息,其中用户配置文件件User是最重要的,它包括:

    • snippets:为各种语言设定的snnippets,每种语言都对应一个json文件
    • keybindings.json:用户自定义的命令和快捷键
    • locale.json:语言设置
    • settings.json:用户修改之后的配置

    portable模式

    vscode意识到了有太多文件夹不够简洁清晰,于是vscode提供了portable(便携)模式,这种模式把所有数据文件都集中放在一个文件夹中。好处是便于移动,换环境之后免于重新配置(即便不是便携模式,也能够通过复制相关文件夹的方式实现复制vscode配置);坏处是注册表、路径需要自己手动更新,需要手动设置许多文件关联。

    关于portable的模式的安装方法详见:https://code.visualstudio.com/docs/editor/portable

    大概步骤如下:

    • 下载zip安装包
    • 把当前的~/.vscode和%APP_DATA%/Code复制到解压后的安装包的data目录

    修改主题

    vscode内置了许多主题,这些主题都是通过json文件指定的。vscode在界面上并没有提供修改主题文件的功能,但我们可以通过修改文本文件的方式来修改细节,例如:把注释颜色调为较亮的绿色。只需要修改vscode安装目录下的主题文件即可:C:\Program Files\Microsoft VS Code\resources\app\extensions\theme-monokai\themes

    修改内置界面

    vscode的设置并没有提供菜单栏、侧边栏的字体设置。但是我们可以通过修改
    C:\Program Files\Microsoft VS Code\resources\app\out\vs\workbench\workbench.main.css文件来实现界面定制。
    其中文件导航侧边栏的css选择器为:

    .monaco-workbench>.part>.content{
      font-size:16px;
      font-family:"微软雅黑";
      line-height: 18px;
    }

    自定义task

    好的系统都是开放的,vscode通过task和extension两种方式向用户开放。

    一个例子

    打开命令面板,configure task命令设置task,会在当前目录的.vscode目录下生成一个tasks.json。再次打开命令面板,task run build命令会执行build过程,这个命令的快捷键为ctrl+shift+B。这是会自动打开控制台执行设定的命令。

    task自动探测

    如果为每个项目都设置很多task,那将会非常费事。而现有的一些构建工具如make、npm、maven等已经包含了很多命令,vscode正在和这些工具集成起来。例如使用npm时,在package.json中定义了run命令,就可以直接通过命令面板执行run命令,不需要更改tasks.json。

    目前vscode只把前端的npm、gulp、grunt等工具的可执行任务集成进来了。

    使用自定义的命令

    假设在scripts文件夹下有一个test命令,我们需要运行这个命令。

    {
        "version": "2.0.0",
        "tasks": [
            {
                "label": "Run tests",
                "type": "shell",
                "command": "./scripts/test.sh"
            }
        ]
    }

    task中的部分字段的含义如下:

    • label:命令的名称,用于在界面中展示
    • type:命令的类型,可取值为shell和process。shell会打开控制台并打印信息,process则只启动一个进程执行并不打印信息。
    • command:实际上需要执行的命令,可以是各种可执行文件。
    • windows、osx、linux:这三个都是是字典类型的字段,在不同的操作系统下task的配置可能有差异,解析时会使用操作系统定义的字段中的内容覆盖掉task其它字段。
    • group:任务也是有组的,把任务分成若干个组更加清晰。最常见的组是生命周期,maven中的构建过程分为compile、build、test、deploy等生命周期,每个生命周期包含若干个命令。
    • problemMatcher:将此字段设为[]可以避免每次选择是否查看输出

    关于task.json的配置细节,参考:https://code.visualstudio.com/docs/editor/tasks-appendix

    把若干个小命令组合起来

    有向无环图DAG在工程界很受欢迎,似乎任何项目中都无法避开有向无环图。原因是因为:好项目必定复杂,复杂必定很大,大则需要拆分,拆分之后会得到一堆小组件,小组件之间必有依赖,有依赖的项目必然构成一个有向无环图,如果有环就变成死循环了。

    vscode中的若干个task也可以组合起来。这通过task的dependOn字段来实现。利用这个字段就能够把一系列task串联起来实现逐步构建。

    {
        "version": "2.0.0",
        "tasks": [
            {
                "label": "Client Build",
                "command": "gulp",
                "args": ["build"],
                "options": {
                    "cwd": "${workspaceRoot}/client"
                }
            },
            {
                "label": "Server Build",
                "command": "gulp",
                "args": ["build"],
                "options": {
                    "cwd": "${workspaceRoot}/server"
                }
            },
            {
                "label": "Build",
                "dependsOn": ["Client Build", "Server Build"]
            }
        ]
    }

    然而,我认为这个功能很鸡肋,这已经超出了vscode的职责范围了,没有dependOn我们照样写出逐步构建的代码,完全可以把depend的一些命令写在一个shell脚本中。

    problem matcher

    vscode task的一个重要作用就是语法检测,在编辑代码时,这些问题检测程序一直在执行,vscode需要读取这些语法检测程序的输出并可视化的展示给用户。

    problem matcher相关的内容较多,设计也很复杂,详见参考资料。

    给任务绑定快捷键

    {
        "key": "ctrl+h",
        "command": "workbench.action.tasks.runTask",
        "args": "Run tests"
    }

    给任务绑定的快捷键command都是相同的,只有args不同,args参数对应task的label字段。
    在vscode中,最好不要给task绑定快捷键,因为keybinding.json是一个全局文件,.vscode文件夹中tasks.json是项目特有的文件。

    变量替换

    在配置task时,我们需要给命令行传递一些参数,如当前文件、当前文件夹。
    例如:

    • ${file}表示当前文件名
    • ${workspaceFolder}表示当前工作空间的名字
    • ${lineNumber}当前文件的行号

    掌握这三个变量替换足够用了,vscode还定义了许多并无卵用的变量,此处是一份详细的变量列表。https://code.visualstudio.com/docs/editor/variables-reference

    编写一个有用的task

    使用vscode经常编写一些单文件程序,使用的语言有多种:

    • java:先使用javac命令编译,然后执行
    • cpp:先使用g++命令编译,然后执行
    • python:使用python命令运行
    • js:使用node运行
    • html:打开浏览器查看

    tasks.json

    {
      "version": "2.0.0",
      "tasks": [
        {
          "label": "build",
          "type": "shell",
          "command": "lang",
          "args": [
            // Ask msbuild to generate full paths for file names.
            "${file}"
          ],
          "group": "build",
          // Use the standard MS compiler pattern to detect errors, warnings and infos
          "problemMatcher": [],
          "promptOnClose": true
        }
      ]
    }
    

    将lang.cmd这个命令放在全局变量PATH下

    python %~dp0\lang.py %*

    主体程序使用python实现

    import sys
    import os
    import tempfile
    """
    使用单文件运行
    """
    if len(sys.argv) <= 1:
        print("usage : lang filename")
        exit(0)
    filename = sys.argv[1]
    print("正在运行", filename, "\n")
    if filename.endswith('.js'):
        os.system('node ' + filename)
    elif filename.endswith('.py'):
        os.system("python " + filename)
    elif filename.endswith('.java'):
        os.system("javac {} -d {}".format(filename, tempfile.gettempdir()))
        os.system("java  -cp {} {}".format(tempfile.gettempdir(),
                                           os.path.basename(filename[:-5])))
    elif filename.endswith('.cpp'):
        os.system("g++ {} -o {}/a.exe".format(filename, tempfile.gettempdir()))
        os.system(os.path.join(tempfile.gettempdir(), "a.exe"))
    elif filename.endswith(".html"):
        os.startfile(filename)
    else:
        print(filename, "是什么文件?")

    经过以上配置,就可以快速实现对单文件的测试了。

    在使用java语言编写单文件程序时,每次运行总是弹出提示“Classpath is incomplete”,这个提示官方已经说明了,这个问题不是事,可以直接设置java.errors.incompleteClasspath.severity忽略掉这个问题。

    编写扩展

    扩展提供的功能

    vscode将哪些接口暴露给了扩展?扩展能够实现哪些功能?

    • vscode负责激活扩展。每个扩展运行的时候都以独立进程运行,vscode负责监视进程执行情况。扩展激活有如下几种情况:文件类型被检测到;目录下包含某种文件;命令面板触发;某种按键组合触发。
    • 读取、写入编辑器内容。
    • 工作空间。获取工作空间目录,状态栏信息,界面布局情况等。
    • 事件。例如打开、关闭、更改某个文件。
    • 编辑交互。包括代码提示、悬浮提示、错误提示等。

    vscode的扩展的两种特殊类型

    • Language Server,语言服务器,用于代码提示、定义跳转、错误检测等。
    • Debugger,调试器,用于代码调试。调试器都是语言必备的组件,扩展的作用就是遵循vscode调试器适配协议在vscode和调试器之间搭建一座桥梁。

    这两种类型的扩展遵循同一套vscode扩展基础架构。这些类型的扩展都和外界工具松耦合,通过某种协议进行交流,vscode提供了调试器适配器协议用来和不同语言的调试器进行交流,提供了语言服务器协议和语言服务器进行交互。

    参考资料

    vscode技巧,内容全面丰富,涉及vscode功能各个方面
    https://code.visualstudio.com/docs/getstarted/tips-and-tricks

    为vscode编写task
    https://code.visualstudio.com/docs/editor/tasks

    vscode插件体系概览
    https://code.visualstudio.com/docs/extensions/overview

    LSP(language server protocol)协议是微软提出的一种协议,功能包括代码提示、查找引用等功能。
    https://microsoft.github.io/language-server-protocol/

    转载于:https://www.cnblogs.com/weiyinfu/p/10156453.html

    展开全文
  • VSCode小说神器Thief-Book-VSCode页数获取

    千次阅读 2020-12-19 17:57:30
    VSCode小说神器Thief-Book-VSCode页数获取 写在前面 做这件事的原因: 用这个工具摸鱼看小说吧,有一个问题,那就是摸鱼的时候很爽,但是有空了可以光明正大看小说的时候,这么一行一行的看就十分离谱,不能跨设备...

    VSCode小说神器Thief-Book-VSCode页数获取

    写在前面

    • 做这件事的原因:
      1. 用这个工具摸鱼看小说吧,有一个问题,那就是摸鱼的时候很爽,但是有空了可以光明正大看小说的时候,这么一行一行的看就十分离谱,不能跨设备同步看小说的进度,但是如果拿出来看吧(比如用手机看,手机可以搜索字段嘛),很容易定位自己摸鱼看的进度。可是看了一段时间,又回到摸鱼的时候,就很难定位自己的进度。
      2. 然后就是,在设置每一行的字数长度的时候(默认是50嘛),设置一次,进度全乱了,很气。但是根据vscode不同的缩放比例(ctrl + ***+***),设置不同的每行字数,很重要,懂我什么意思叭(歪头)。
      3. 所以,我就寻思,得想个办法,可以根据某个关键词,定位我看到哪儿了,然后计算这个是拿一页。于是我开始了我的艰难的阅读源码之旅,然后写个python脚本来解决这个问题
      4. 如果有需求的话,觉得脚本不香的话,我可以做个软件,不懂编程的人也能用啦(但是不懂编程的人用vscode干神魔呢?(歪头))
    • 参考连接:
      1. Thief-Book-VSCode的github地址
      2. 主要参考源码地址
      3. 插件安装地址

    解决方案

    1. 如果不会编程的话,我可以想办法把程序做成小软件,留言告诉我哦。(没需求我就不做了)

    2. 以下是python代码,环境python3.7

      #!/usr/bin/env python
      # -*- coding: UTF-8 -*-
      # coding=utf-8 
      
      """
      @author: Li Tian
      @contact: litian_cup@163.com
      @software: pycharm
      @file: xiaoshuo_locatoin.py
      @time: 2020/12/19 14:07
      @desc: Thief-Book-VSCode查找小说的显示进度
      """
      
      from dataclasses import dataclass
      from math import ceil
      
      
      @dataclass
      class XiaoshuoLocation:
          line_length: int
          file_path: str
      
          def __post_init__(self):
              self.pages, self.view_list = self.get_location()
      
          def depart_line(self, line):
              count = int(len(line) / 30) + 1
              result_line = []
              for i in range(count):
                  start = i * self.line_length
                  end = start + self.line_length
                  result_line.append(line[start: end])
              return result_line
      
          def get_location(self):
              """获取小说的显示页数"""
              with open(self.file_path, 'r', encoding='utf-8') as f:
                  result = f.read()
                  temp = result.replace('\n', " ").replace('\r', " ").replace('  ', " ").replace(' ', " ")
      
                  return ceil(len(temp) / self.line_length), self.depart_line(temp)
      
          def search_words(self, aim_words):
              count = 1
              for line in self.view_list:
                  if aim_words in line:
                      print(count, ": ", line)
      
                  count += 1
      
      
      if __name__ == '__main__':
          XiaoshuoLocation(30, 'E:\study_books\《明朝那些事》(全集).txt').search_words('小弟的肩膀')
      
    3. 使用方式不用我教了叭

      • 30:每行多少个字嘛,就是配置里面的那个Page Size

      • 后面的就是小说的txt路径啦

      • 最后一个参数:就是要搜索的内容,如果查不到的话,如果你改了PageSize,是有可能查不到的,因为原来是一个page 的,可能分成两个page了,被隔断了,那就搜内容的前后一小部分看看。

      • 结果展示:冒号前面的数字,就是你要的目标页数啦。

        在这里插入图片描述

    源码解析

    讲道理,看完源码,觉得内存烧的有点多,内容啊、页码啊获取一次就好啦,我看每次翻页都要搞一次IO,很影响性能的。希望作者可以优化一下代码,早日添加内容搜索定位页码的功能嗷!

    1. 首先啊,先贴上这个神器的源码

      import { ExtensionContext, workspace, window } from 'vscode';
      import * as fs from "fs";
      
      export class Book {
          // 现在是哪一页
          curr_page_number: number = 1;
          // 每一页显示的长度
          page_size: number | undefined = 50;
          // text分几页,总页数
          page = 0;
          start = 0;
          end = this.page_size;
          // 文件路径
          filePath: string | undefined = "";
          extensionContext: ExtensionContext;
      
          constructor(extensionContext: ExtensionContext) {
              this.extensionContext = extensionContext;
          }
      
          getSize(text: string) {
              // text长度
              let size = text.length;
              // text分几页,向上取整
              this.page = Math.ceil(size / this.page_size!);
          }
      
          getFileName() {
              var file_name: string | undefined = this.filePath!.split("/").pop();
              console.log(file_name);
          }
      
          getPage(type: string) {
              // 取出当前页
              var curr_page = <number>workspace.getConfiguration().get('thiefBook.currPageNumber');
              var page = 0;
      
              if (type === "previous") {
                  // 如果按了上一页,当前页减一或为第一页
                  if (curr_page! <= 1) {
                      page = 1;
                  } else {
                      page = curr_page - 1;
                  }
              } else if (type === "next") {
                  // 如果按了下一页,当前页加一
                  if (curr_page! >= this.page) {
                      page = this.page;
                  } else {
                      page = curr_page + 1;
                  }
              } else if (type === "curr") {
                  page = curr_page;
              }
      
              this.curr_page_number = page;
              // this.curr_page_number = this.extensionContext.globalState.get("book_page_number", 1);
          }
      
          updatePage() {
              workspace.getConfiguration().update('thiefBook.currPageNumber', this.curr_page_number, true);
          }
      
          getStartEnd() {
              this.start = this.curr_page_number * this.page_size!;
              this.end = this.curr_page_number * this.page_size! - this.page_size!;
          }
      
          readFile() {
              if (this.filePath === "" || typeof (this.filePath) === "undefined") {
                  window.showWarningMessage("请填写TXT格式的小说文件路径 & Please fill in the path of the TXT format novel file");
              }
      
              var data = fs.readFileSync(this.filePath!, 'utf-8');
      
              var line_break = <string>workspace.getConfiguration().get('thiefBook.lineBreak');
      
              return data.toString().replace(/\n/g, line_break).replace(/\r/g, " ").replace(/  /g, " ").replace(/ /g, " ");
          }
      
          init() {
              this.filePath = workspace.getConfiguration().get('thiefBook.filePath');
              var is_english = <boolean>workspace.getConfiguration().get('thiefBook.isEnglish');
      
              if (is_english === true) {
                  this.page_size = <number>workspace.getConfiguration().get('thiefBook.pageSize') * 2;
              } else {
                  this.page_size = workspace.getConfiguration().get('thiefBook.pageSize');
              }
          }
      
          getPreviousPage() {
              this.init();
      
              let text = this.readFile();
      
              this.getSize(text);
              this.getPage("previous");
              this.getStartEnd();
      
              var page_info = this.curr_page_number.toString() + "/" + this.page.toString();
      
              this.updatePage();
              return text.substring(this.start, this.end) + "    " + page_info;
          }
      
          getNextPage() {
              this.init();
      
              let text = this.readFile();
      
              this.getSize(text);
              this.getPage("next");
              this.getStartEnd();
      
              var page_info = this.curr_page_number.toString() + "/" + this.page.toString();
      
              this.updatePage();
      
              return text.substring(this.start, this.end) + "    " + page_info;
          }
      
          getJumpingPage() {
              this.init();
      
              let text = this.readFile();
      
              this.getSize(text);
              this.getPage("curr");
              this.getStartEnd();
      
              var page_info = this.curr_page_number.toString() + "/" + this.page.toString();
      
              this.updatePage();
      
              return text.substring(this.start, this.end) + "    " + page_info;
          }
      }
      
    2. 我们先看readFile()函数

      readFile() {
          if (this.filePath === "" || typeof (this.filePath) === "undefined") {
              window.showWarningMessage("请填写TXT格式的小说文件路径 & Please fill in the path of the TXT format novel file");
          }
      
          var data = fs.readFileSync(this.filePath!, 'utf-8');
      
          var line_break = <string>workspace.getConfiguration().get('thiefBook.lineBreak');
      
          return data.toString().replace(/\n/g, line_break).replace(/\r/g, " ").replace(/  /g, " ").replace(/ /g, " ");
      }
      
      • 先读文件路径

      • 然后读文件

      • 获取line_break,也就是分隔符(默认是一个空格)

      • 替换各个符号

        • /[\r]/g在js中是正则表达式对象,在两个/之间的部分是表达式的主体,表示要匹配的字符串;g表示在整个字符串中搜索。所以这段代码中要匹配的字符串是[\r]所代表的字符串,其中[]”表示字符的可选范围。

        • 首先是\n,即软回车,替换为line_break

        • 然后是把\r,即软空格,表示回到当前行的行首,替换为一个空格

          print('asdf\rqw')
          # qw
          
        • 然后是一个unicode为12288的字符,为全角空格,这里替换为一个空格,

          print(ord(' '))
          # 12288
          
        • 然后是将空格转换为空格,这里我蒙了。。。

        • 最后返回的就是各种处理之后的小说文字了,string。

    3. 然后从按键的逻辑粗发

      getPage(type: string) {
          // 取出当前页
          var curr_page = <number>workspace.getConfiguration().get('thiefBook.currPageNumber');
          var page = 0;
      
          if (type === "previous") {
              // 如果按了上一页,当前页减一或为第一页
              if (curr_page! <= 1) {
                  page = 1;
              } else {
                  page = curr_page - 1;
              }
          } else if (type === "next") {
              // 如果按了下一页,当前页加一
              if (curr_page! >= this.page) {
                  page = this.page;
              } else {
                  page = curr_page + 1;
              }
          } else if (type === "curr") {
              page = curr_page;
          }
          this.curr_page_number = page;
      
      • 先获取当前页,从设置里面的当前页获取这个值
      • !:用在赋值的内容后时,使null和undefined类型可以赋值给其他类型并通过编译
      • 然后是if-else逻辑了:
        • 如果是 上一页 :先检查当前页是不是<=1,是的话就把page=1,否则page=当前页-1
        • 如果是 下一页 :先检查当前页是不是>=小说的总页数,是的话page=小说的总页数,否则page=当前页+1
        • 如果是 当前页 :page=当前页
        • 设置全局当前页为page
    4. 初始化

      init() {
          this.filePath = workspace.getConfiguration().get('thiefBook.filePath');
          var is_english = <boolean>workspace.getConfiguration().get('thiefBook.isEnglish');
      
          if (is_english === true) {
              this.page_size = <number>workspace.getConfiguration().get('thiefBook.pageSize') * 2;
          } else {
              this.page_size = workspace.getConfiguration().get('thiefBook.pageSize');
          }
      }
      
      • 获取文件路径,放到全局变量filePath
      • 英文处理:这就不说了
      • 获取每一页显示的长度,默认50
      • 所以初始化就这两步
    5. 上一页的逻辑

      getPreviousPage() {
          this.init();
      
          let text = this.readFile();
      
          this.getSize(text);
          this.getPage("previous");
          this.getStartEnd();
      
          var page_info = this.curr_page_number.toString() + "/" + this.page.toString();
      
          this.updatePage();
          return text.substring(this.start, this.end) + "    " + page_info;
      }
      
      • 初始化
      • 获取小说string
      • getSize:获取整篇小说的长度,并进行分页
      • 获取上一页,这里将全局变量curr_page_number设置为 上一页
      • 获取开始和结束:
        • 全局变量开始 = 全局变量curr_page_number × 每一页长度
        • 全局变量结束 = 全局变量curr_page_number × 每一页长度 - 每一页长度
      • page_info:这里显示当前页/总页数
      • updatePage:将当前页的值写到配置文件中
      • 返回:每页的文字 + 四个空格 + page_info
      • 下一页和跳页的逻辑几乎一样

    我的CSDN:https://blog.csdn.net/qq_21579045

    我的博客园:https://www.cnblogs.com/lyjun/

    我的Github:https://github.com/TinyHandsome

    纸上得来终觉浅,绝知此事要躬行~

    欢迎大家过来OB~

    by 李英俊小朋友

    展开全文
  • VScode软件入门详解

    千次阅读 2020-03-05 16:01:12
    VScode软件入门 VScode如何自定义用户代码块 左上角:文件->首选项->用户代码片段 右下角:设置->用户代码片段 ...body :这个是代码段的主体.需要编写的代码放在这里,  $1 :生成代码...

    VScode软件入门

    VScode如何自定义用户代码块

    • 左上角:文件->首选项->用户代码片段
    • 右下角:设置->用户代码片段
    • 新建全局代码片段等
    • 创建文件.json文件
    • 代码块规则如下

    prefix :代码片段名字,即输入此名字就可以调用代码片段。
    body :这个是代码段的主体.需要编写的代码放在这里,     
    $1 :生成代码后光标的初始位置.
    $2 :生成代码后光标的第二个位置,按tab键可进行快速切换,还可以有$3,$4,$5…
    ${1,字符} :生成代码后光标的初始位置(其中1表示光标开始的序号,字符表示生成代码后光标会直接选中字符。)
    description :代码段描述,输入名字后编辑器显示的提示信息。
    换行:\r或者\n tab键制表符: \t


    // 前缀部分没有什么好介绍的,唯一值得注意的是,前缀支持 N:1,也即允许多条前缀对应同一条代码片。在使用时,只需将前缀定义为数组即可,数组中的每一个前缀都能对应本代码片。 “prefix”: [ “header”, “stub”, “copyright”],
    // 用「Tabstops」可以让编辑器的指针在 snippet 内跳转。使用 $1,$2 等指定光标位置。这些数字指定了光标跳转的顺序。特别地,$0表示最终光标位置。

    自定义代码块:代码例子

    {
    	/* 
    	prefix      :代码片段名字,即输入此名字就可以调用代码片段。
    	body        :这个是代码段的主体.需要编写的代码放在这里,      
    	$1          :生成代码后光标的初始位置.
    	$2          :生成代码后光标的第二个位置,按tab键可进行快速切换,还可以有$3,$4,$5.....
    	${1,字符}    :生成代码后光标的初始位置(其中1表示光标开始的序号,字符表示生成代码后光标会直接选中字符。)
    	description :代码段描述,输入名字后编辑器显示的提示信息。
    	*/
    	//   换行:\r或者\n     tab键制表符: \t
    	// 前缀部分没有什么好介绍的,唯一值得注意的是,前缀支持 N:1,也即允许多条前缀对应同一条代码片。在使用时,只需将前缀定义为数组即可,数组中的每一个前缀都能对应本代码片。    "prefix": [ "header", "stub", "copyright"],
    	// 用「Tabstops」可以让编辑器的指针在 snippet 内跳转。使用 $1,$2 等指定光标位置。这些数字指定了光标跳转的顺序。特别地,$0表示最终光标位置。
    	"Vue": {
    		"prefix": "vue1", // 对应的是使用这个模板的快捷键
    		"body": [
    			"<!DOCTYPE html>",
    			"<html lang=\"en\">\n",
    			"<head>",
    			"\t<meta charset=\"UTF-8\">",
    			"\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
    			"\t<meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\">",
    			"\t<title>Document</title>",
    			"\t$BLOCK_COMMENT_START  IMPORT CSS $BLOCK_COMMENT_END\n",
    			"</head>\n",
    			"<body>",
    			"\t<div id=\"app\">\n\n\t</div>\n",
    			"\t$BLOCK_COMMENT_START  IMPORT JS $BLOCK_COMMENT_END",
    			"\t<script src=\"../node_modules/vue/dist/vue.js\"></script>",
    			"\t<script>",
    			"\t\tlet vm = new Vue({",
    			"\t\t\tel: '#app',",
    			"\t\t\tdata: {\n\t\t\t\t$1\n\t\t\t},",
    			"\t\t\tcreated() {\n\t\t\t\t$2\n\t\t\t},",
    			"\t\t\tmethods: {\n\t\t\t\t$3\n\t\t\t},",
    			"\t\t\tfilters: {\n\t\t\t\t$4\n\t\t\t},",
    			"\t\t\tcomputed: {\n\t\t\t\t$5\n\t\t\t},",
    			"\t\t\twatch: {\n\t\t\t\t$6\n\t\t\t},",
    			"\t\t\tcomponents: {\n\t\t\t\t$7\n\t\t\t},",
    			"\t\t});",
    			"\t</script>",
    			"</body>\n",
    			"<html>"
    		],
    		"description": "vue模板1" // 模板的描述
    	}
    }
    

    Vue 2 Snippets(代码模块-插件)

    Prefix	HTML Snippet Content
    template	<template></template>
    script	<script></script>
    style	<style></style>
    vText	v-text=msg
    vHtml	v-html=html
    vShow	v-show
    vIf	v-if
    vElse	v-else
    vElseIf	v-else-if
    vForWithoutKey	v-for
    vFor	v-for="" :key=""
    vOn	v-on
    vBind	v-bind
    vModel	v-model
    vPre	v-pre
    vCloak	v-cloak
    vOnce	v-once
    key	:key
    ref	ref
    slotA	slot=""
    slotE	<slot></slot>
    slotScope	slot-scope=""
    component	<component :is=''></component>
    keepAlive	<keep-alive></keep-alive>
    transition	<transition></transition>
    transitionGroup	<transition-group></transition-group>
    enterClass	enter-class=''
    leaveClass	leave-class=''
    appearClass	appear-class=''
    enterToClass	enter-to-class=''
    leaveToClass	leave-to-class=''
    appearToClass	appear-to-class=''
    enterActiveClass	enter-active-class=''
    leaveActiveClass	leave-active-class=''
    appearActiveClass	appear-active-class=''
    beforeEnterEvent	@before-enter=''
    beforeLeaveEvent	@before-leave=''
    beforeAppearEvent	@before-appear=''
    enterEvent	@enter=''
    leaveEvent	@leave=''
    appearEvent	@appear=''
    afterEnterEvent	@after-enter=''
    afterLeaveEvent	@after-leave=''
    afterAppearEvent	@after-appear=''
    enterCancelledEvent	@enter-cancelled=''
    leaveCancelledEvent	@leave-cancelled=''
    appearCancelledEvent	@appear-cancelled=''
    Prefix	Vue Router Snippet Content
    routerLink	<router-link></router-link>
    routerView	<router-view></router-view>
    to	to=""
    tag	tag=""
    newVueRouter	const router = newVueRouter({ })
    routerBeforeEach	router.beforeEach((to, from, next) => { }
    routerBeforeResolve	router.beforeResolve((to, from, next) => { }
    routerAfterEach	router.afterEach((to, from) => { }
    routerPush	router.push()
    routerReplace	router.replace()
    routerGo	router.back()
    routerBack	router.push()
    routerForward	router.forward()
    routerGetMatchedComponents	router.getMatchedComponents()
    routerResolve	router.resolve()
    routerAddRoutes	router.addRoutes()
    routerOnReady	router.onReady()
    routerOnError	router.onError()
    routes	routes: []
    beforeEnter	beforeEnter: (to, from, next) => { }
    beforeRouteEnter	beforeRouteEnter (to, from, next) { }
    beforeRouteLeave	beforeRouteLeave (to, from, next) { }
    scrollBehavior	scrollBehavior (to, from, savedPosition) { }
    Prefix	Vuex Snippet Content
    newVuexStore	const store = new Vuex.Store({ })
    Prefix	Nuxt.js Snippet Content
    nuxt	<nuxt/>
    nuxtChild	<nuxt-child/>
    nuxtLink	<nuxt-link to=""/>
    asyncData	asyncData() {}
    

    VScode快捷键

    全局
    Ctrl + Shift + P, F1 显示命令面板
    Ctrl + P 快速打开
    Ctrl + Shift + N 打开新窗口
    Ctrl + Shift + W 关闭窗口
    基本
    Ctrl + X 剪切(未选中文本的情况下,剪切光标所在行)
    Ctrl + C 复制(未选中文本的情况下,复制光标所在行)
    Alt + Up 向上移动行
    Alt + Down 向下移动行
    Shift + Alt + Up 向上复制行
    Shift + Alt + Down 向下复制行
    Ctrl + Shift + K 删除行
    Ctrl + Enter 下一行插入
    Ctrl + Shift + Enter 上一行插入
    Ctrl + Shift + \ 跳转到匹配的括号
    Ctrl + ] 增加缩进
    Ctrl + [ 减少缩进
    Home 跳转至行首
    End 跳转到行尾
    Ctrl + Home 跳转至文件开头
    Ctrl + End 跳转至文件结尾
    Ctrl + Up 按行向上滚动
    Ctrl + Down 按行向下滚动
    Alt + PgUp 按屏向上滚动
    Alt + PgDown 按屏向下滚动
    Ctrl + Shift + [ 折叠代码块
    Ctrl + Shift + ] 展开代码块
    Ctrl + K Ctrl + [ 折叠全部子代码块
    Ctrl + K Ctrl + ] 展开全部子代码块
    Ctrl + K Ctrl + 0 折叠全部代码块
    Ctrl + K Ctrl + J 展开全部代码块
    Ctrl + K Ctrl + C 添加行注释
    Ctrl + K Ctrl + U 移除行注释
    Ctrl + / 添加、移除行注释
    Shift + Alt + A 添加、移除块注释
    Alt + Z 自动换行、取消自动换行
    多光标与选择
    Alt + 点击 插入多个光标
    Ctrl + Alt + Up 向上插入光标
    Ctrl + Alt + Down 向下插入光标
    Ctrl + U 撤销上一个光标操作
    Shift + Alt + I 在所选行的行尾插入光标
    Ctrl + I 选中当前行
    Ctrl + Shift + L 选中所有与当前选中内容相同部分
    Ctrl + F2 选中所有与当前选中单词相同的单词
    Shift + Alt + Left 折叠选中
    Shift + Alt + Right 展开选中
    Shift + Alt + 拖动鼠标 选中代码块
    Ctrl + Shift + Alt + Up 列选择 向上
    Ctrl + Shift + Alt + Down 列选择 向下
    Ctrl + Shift + Alt + Left 列选择 向左
    Ctrl + Shift + Alt + Right 列选择 向右
    Ctrl + Shift + Alt + PgUp 列选择 向上翻页
    Ctrl + Shift + Alt + PgDown 列选择 向下翻页
    查找替换
    Ctrl + F 查找
    Ctrl + H 替换
    F3 查找下一个
    Shift + F3 查找上一个
    Alt + Enter 选中所有匹配项
    Ctrl + D 向下选中相同内容
    Ctrl + K Ctrl + D 移除前一个向下选中相同内容
    Alt + C 区分大小写
    Alt + R 正则
    Alt + W 完整匹配
    进阶
    Ctrl + Space 打开建议
    Ctrl + Shift + Space 参数提示
    Tab Emmet插件缩写补全
    Shift + Alt + F 格式化
    Ctrl + K Ctrl + F 格式化选中内容
    F12 跳转到声明位置
    Alt + F12 查看具体声明内容
    Ctrl + K F12 分屏查看具体声明内容
    Ctrl + . 快速修复
    Shift + F12 显示引用
    F2 重命名符号
    Ctrl + Shift + . 替换为上一个值
    Ctrl + Shift + , 替换为下一个值
    Ctrl + K Ctrl + X 删除行尾多余空格
    Ctrl + K M 更改文件语言
    导航
    Ctrl + T 显示所有符号
    Ctrl + G 跳转至某行
    Ctrl + P 跳转到某个文件
    Ctrl + Shift + O 跳转到某个符号
    Ctrl + Shift + M 打开问题面板
    F8 下一个错误或警告位置
    Shift + F8 上一个错误或警告位置
    Ctrl + Shift + Tab 编辑器历史记录
    Alt + Left 后退
    Alt + Right 前进
    Ctrl + M 切换焦点
    编辑器管理
    Ctrl + F4, Ctrl + W 关闭编辑器
    Ctrl + K F 关闭文件夹
    Ctrl + \ 编辑器分屏
    Ctrl + 1 切换到第一分组
    Ctrl + 2 切换到第二分组
    Ctrl + 3 切换到第三分组
    Ctrl + K Ctrl + Left 切换到上一分组
    Ctrl + K Ctrl + Right 切换到下一分组
    Ctrl + Shift + PgUp 左移编辑器
    Ctrl + Shift + PgDown 右移编辑器
    Ctrl + K Left 激活左侧编辑组
    Ctrl + K Right 激活右侧编辑组
    文件管理
    Ctrl + N 新建文件
    Ctrl + O 打开文件
    Ctrl + S 保存
    Ctrl + Shift + S 另存为
    Ctrl + K S 全部保存
    Ctrl + F4 关闭
    Ctrl + K Ctrl + W 全部关闭
    Ctrl + Shift + T 重新打开被关闭的编辑器
    Ctrl + K Enter 保持打开
    Ctrl + Tab 打开下一个
    Ctrl + Shift + Tab 打开上一个
    Ctrl + K P 复制当前文件路径
    Ctrl + K R 在资源管理器中查看当前文件
    Ctrl + K O 新窗口打开当前文件
    显示
    F11 全屏、退出全屏
    Shift + Alt + 1 切换编辑器分屏方式(横、竖)
    Ctrl + + 放大
    Ctrl + - 缩小
    Ctrl + B 显示、隐藏侧边栏
    Ctrl + Shift + E 显示资源管理器 或 切换焦点
    Ctrl + Shift + F 显示搜索框
    Ctrl + Shift + G 显示Git面板
    Ctrl + Shift + D 显示调试面板
    Ctrl + Shift + X 显示插件面板
    Ctrl + Shift + H 全局搜索替换
    Ctrl + Shift + J 显示、隐藏高级搜索
    Ctrl + Shift + C 打开新命令提示符窗口
    Ctrl + Shift + U 显示输出面板
    Ctrl + Shift + V 显示、隐藏 Markdown预览窗口
    Ctrl + K V 分屏显示 Markdown预览窗口
    调试
    F9 设置 或 取消断点
    F5 开始 或 继续
    F11 进入
    Shift + F11 跳出
    F10 跳过
    Ctrl + K Ctrl + I 显示悬停信息
    集成终端
    Ctrl + 显示命令提示符窗口 Ctrl + Shift + 新建命令提示符窗口
    Ctrl + Shift + C 复制所选内容
    Ctrl + Shift + V 粘贴所选内容
    Ctrl + Up 向上滚动
    Ctrl + Down 向下滚动
    Shift + PgUp 向上翻页
    Shift + PgDown 向下翻页
    Ctrl + Home 滚动到顶部
    Ctrl + End 滚动到底部

    重命名变量: 选中变量名后按F2
    转到变量名的定义处: 选中变量名后按F12
    同时选择多个单词: Alt + Click
    同时选择上一行 (Ctrl + Alt + Up) 或者下一行 (Ctrl + Alt + Down) 的相同位置:
    依次找出文中所有的当前选中的单词: Ctrl + D
    一次性找出文所有的当前选中的单词: Ctrl + Shift + L
    拓展性 (Shift + Alt + Right) 或者收缩性 (Shift + Alt + Left) 的选中文本
    矩形框的鼠标选择: 同时按住Shit和Alt并使用鼠标进行拖拽选择
    切换编程语言语法: Ctrl + K M
    在上方复制一行Shift + Alt + Up,在下方复制一行Shift + Alt + Down

    常用指令

    依次找出文中所有的当前选中的单词: Ctrl + D
    反向缩进:shift+tab

    快捷html结构

    • div*4>img[src="./img/banner$.jpg"]
    <div><img src="./img/banner1.jpg" alt=""></div>
    <div><img src="./img/banner2.jpg" alt=""></div>
    <div><img src="./img/banner3.jpg" alt=""></div>
    <div><img src="./img/banner4.jpg" alt=""></div>
    

    谷歌快捷键

    F11 全屏
    ctrl+ -/+ 缩小 放大
    ctrl+f 查找

    VScode软件必备插件详解(部分选择性安装)

    Auto Close Tag:

    自动添加HTML / XML关闭标签(必备)

    Auto Rename Tag

    自动重命名配对的HTML / XML标签(必备)

    Beautify

    格式化javascript,JSON,CSS,Sass,和HTML

    Bracket Pair Colorizer

    颜色识别匹配括号

    Chinese

    适用于VS Code的中文(简体)语言包

    Code Runner

    非常强大的一款插件,能够运行多种语言的代码片段或代码文件:C,C ++,Java,JavaScript,PHP,Python,Perl,Ruby,Go等等,安装完成后,右上角出现:> 点击这个按钮就可以运行你的文件了(必备)

    Code Spell Checker

    一个基本的拼写检查器,可以很好地与camelCase代码一起使用。
    此拼写检查器的目的是帮助捕获常见的拼写错误,同时保持较低的误报率。

    css peek

    能够查看CSS ID和类的字符串作为HTML文件中相应的CSS定义(必备)
    使用方法:将光标放在class里面的属性,右击

    Easy LESS

    在Visual Studio Code中轻松处理LESS文件。
    LESS样式表的 “保存时编译”,而无需使用构建任务。

    1. 创建一个.less文件。
    2. 点击Ctrl / Cmd + S保存文件。
    3. .css文件自动生成。
    4. 您应该在状态栏中看到一个临时的“在_X_毫秒内编译较少”消息。

    注意:也可以从命令选项板中将其作为“将LESS编译为CSS”。

    Document This

    添加注释块

    设置:

    "docthis.includeAuthorTag": true,//出现@Author
     "docthis.includeDescriptionTag": true,//出现@Description
     "docthis.authorName": "shenzekun",//作者名字
    

    快捷键: 按两次Ctrl+alt+d

    ESLint

    EsLint可以帮助我们检查Javascript编程时的语法错误。比如:在Javascript应用中,你很难找到你漏泄的变量或者方法。EsLint能够帮助我们分析JS代码,找到bug并确保一定程度的JS语法书写的正确性。> ESLint最初是由Nicholas C. Zakas于2013年6月创建的开源项目。它的目标是提供一个插件化的javascript代码检测工具。

    因此,ESLint就是一个语法规则和代码风格的检查工具,可以用来保证写出语法正确、风格统一的代码。

    HTML CSS Support

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

    Live Server

    启动具有实时重新加载功能的本地开发服务器,以处理静态和动态页面。
    启动/停止服务器的快捷方式
    [注意:如果工作空间中没有文件.html.htm文件,则必须按照方法4和5来启动服务器。

    1. 打开一个项目,然后Go Live从状态栏中单击以打开/关闭服务器。
    2. 右键单击HTML资源管理器窗口中的文件,然后单击Open with Live Server。 。
    3. 打开一个HTML文件,右键单击编辑器,然后单击Open with Live Server
    4. 单击“ (alt+L, alt+O)打开服务器”并(alt+L, alt+C)停止服务器(您可以更改快捷方式窗体的键盘绑定)。[在MAC上,cmd+L, cmd+Ocmd+L, cmd+C]
    5. 通过按F1或打开命令面板,ctrl+shift+P然后键入Live Server: Open With Live Server以启动服务器或键入Live Server: Stop Live Server以停止服务器。

    open in browser

    当前的 html 文件用浏览器打开,类似 webstorm 的那四个小浏览器图标功能,前提条件html 文件必须保存
    快捷键alt+b

    Power Mode

    打字鼠标效果

    Terminal

    在命令面板(Ctrl+Shift+P)搜索用户配置,在用户配置文件中,找到Run Code configuration下的code-runner.runInTerminal的值改为true,就好了。

    vscode-icons

    目录树图标

    react

    React-Native/React/Redux snippets for es6/es7

    react代码片段,下载人数超多😉

    react-beautify

    格式化 javascript, JSX, typescript, TSX 文件

    vue

    vetur

    语法高亮、智能感知

    VueHelper

    vue代码片段

    Vue TypeScript Snippets

    vue的 typescript 代码片段

    Vue 2 Snippets

    vue 2代码片段

    主题

    One Dark Pro

    这个也好看😄

    Horla Light Theme

    vscode的七彩灯光主题

    展开全文
  • vscode作为一款好用的轻量级代码编辑器,不仅支持代码调试,而且还有丰富的插件库,可以说是免费好用,对于初学者来说用来写写python是再合适不过了。下面就推荐几款个人觉得还不错的插件,希望可以帮助大家更好的写...
  • snippet 简介snippet即代码段,指的是能够帮助输入重复代码模式,比如循环或条件语句的模板。通过 snippet ,我们...vsCode进入snippet的三种方法1.通过快捷键「Ctrl + Shift + P」打开命令窗口(All Command Wind...
  • vscode作为一款好用的轻量级代码编辑器,不仅支持代码调试,而且还有丰富的插件库,可以说是免费好用,对于初学者来说用来写写python是再合适不过了。下面就推荐几款个人觉得还不错的插件,希望可以帮助大家更好的写...
  • VSCode 添加代码块

    2021-04-02 16:28:34
    那么在使用VSCode的时候,我们也想和使用Xcode一样,设置代码块,方便平时开发调用,改如何去设置呢???前往下看???? 1.打开VSCode设置 找到设置里面的“User Snippets”(用户代码片段) 2.选择代码块文件...
  • vscode主题安装

    千次阅读 2019-09-22 21:13:15
    安装主题 快捷键Ctrl Shift X打开安装插件 ...扩展插件vscode-icon 鼠标滚轮设置字体大小 打开setting.json文件 修改setting.json,追加"editor.mouseWheelZoom": true { "editor.fontSize": 16, "workben...
  • VScode 浅灰色主题

    2020-11-09 10:20:43
    VScode 浅灰色主题 Github Light Theme - Gray 以前都喜欢用深色主题,就是黑色的感觉不伤眼,但是最近觉得看深色主题眼睛感觉更累,记忆力不集中的样子(个人感觉哈)。 然后就找了找浅色主题,找到了这个Github ...
  • vscode 好用的扩展

    2020-12-23 16:48:04
    Material Icon Theme:图标主体,这款用的顺手,比默认的好看多了 open in browser:在浏览器中打开当前页面,做小 demo 的时候有用,也可以直接使用线上 demo 平台(codepen,codesandbox 等) ...
  • vscode和stylus通用配置方案

    千次阅读 2017-11-07 22:14:24
    vscode和stylus通用配置方案 stylus , stylus format , vscode vetur
  • vscode 自定义主题样式

    万次阅读 2017-08-28 20:38:25
    以tomorrow主题为例,我们进入插件目录C:\Users\你的用户名\.vscode\extensions\ms-vscode.theme-tomorrowkit-0.1.4\themes, 用编辑器打开Tomorrow.tmTheme 搜索keyword,找到这一段,在加上italic
  • 代码片适用的「语言模式」(可选) prefix :触发快捷提示的字符串前缀 body :代码片段主体 $num 是每次按 tab 键光标移动对位置,$0 表示光标最后停留位置,不设置 $0,这光标最终位置在文件末尾; ${2:默认文本} ...
  • VSCode技术揭秘(一)

    千次阅读 2019-10-27 18:00:29
    Visual Studio Code(以下简称VSCode)是一个轻量且强大的跨平台开源代码编辑器(IDE),VSCode 采用了 Electron,使用的代码编辑器名为 Monaco、Monaco 也是 Visual Studio Team Service(Visual Studio Online)...
  • 1、搜索扩展:vscode-icons,点击对应的“安装”按钮 2、验证安装效果 建立不同的文件、文件夹,会出现不同的图标,如下所示
  • VScode主题设置

    千次阅读 2020-03-13 15:10:56
    快捷键: 键盘组合键ctrl+K,ctrl+T。 或者点击“file”,“preferences”,如果有的人已经汉化了的话,操作是“文件”,“首选项”,在preferences选项下面找到“color theme”,也就是我们中文版的“颜色主题”。...
  • VSCode自定义主题

    2020-07-03 14:29:40
    Mine", "displayName": "%displayName%", "description": "%description%", "version": "1.0.0", "publisher": "vscode", "license": "MIT", "engines": { "vscode": "*" }, "contributes": { "themes":...
  • vscode 全透明背景图

    万次阅读 2018-08-16 16:10:29
    一.前言  08.02更新:已魔改插件 可以直接下载插件使用了 下载地址, 下载后手动安装就ok了,具体...今天看到了博客园 这篇文章 后 Visual Studio 2017 设置透明背景图 ,琢磨了下难道vscode不行吗。。 ...
  • vscode使用笔记

    2019-10-20 11:05:13
    One Dark Pro & Brackets Light Pro :一个深色主体一个亮色主体,可以换着来。 Code Spell Checker:代码拼写检查 vscode 添加清空控制台Ctrl+K快捷键 按住Ctrl+Shift+P组合按钮打开设置窗口,输入>open ...
  • 前端好用vscode插件

    2019-07-15 22:43:02
    1.js函数括号 花括号 ...9.atom黑暗主体配色 One Dark Pro  https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme   10.atom白色主题配色 Atom One Light Theme ...
  • VS Databricks扩展 这是一个Visual Studio Code扩展,它使您可以在本地有效地...支持静态安装点(例如,使用服务主体) 上传文件 下载档案 秘密浏览器 创建/删除机密作用域 创建/删除机密 使用集成CI / CD 支持多个D
  • vscode自定义代码片段

    2021-04-21 10:11:06
    有些代码是通用的,每次都要重写或者复制太麻烦,希望通过vscode自定义用户代码片段,需要用的时候,直接使用。 二,新建用户代码片段流程 1,打开自定义代码片段文件:文件>首选项>用户代码片段>选择要...
  • vscode自定义代码块

    2021-01-07 16:41:03
    首先打开 Vscode,依次点击文件——首选项——用户代码片段-选择vue 把下面代码复制进去vue.json { "Print to console": { "prefix": "vue", "body": [ "<template>", "\t<div></div>...
  • 推荐几款好用的VsCode色彩主题

    万次阅读 多人点赞 2020-09-11 00:11:09
    经常对着同一款主题,有没有想着换一拨呢? 推荐一些个人觉得比较不错的主题,可以自己选择, 所有主题可以直接在扩展商店下载,直接上主题: Gatito Theme Dark Night Owl ...ReUI
  • vscode设置代码段

    千次阅读 2020-10-28 16:09:59
    body :这个是代码段的主体.需要编写的代码放在这里,  $1 :生成代码后光标的初始位置. $2 :生成代码后光标的第二个位置,按tab键可进行快速切换,还可以有$3,$4,$5..... ${1,字符} :生成代码后光标的初
  • VSCode取消注释斜体

    2020-12-19 23:13:59
    直接在这里改主体,这个主题,就不是斜体! 其他自己摸索 这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的...
  • html基础 vscode写代码

    2020-10-13 22:44:50
     VisualStudioCode(简称VSCode)是Microsoft开发的代码编辑器,它支持Windows,Linux和macOS等操作系统以及开源代码。它支持测试,并具有内置的Git版本控制功能以及开发环境功能,例如代码完成(类似于...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,909
精华内容 763
关键字:

vscode主体