VSCode&Hexo快捷键和操作命令

VSCode中 非常好用的快捷命令

多行操作

  • 选中多行进行操作:Alt + 鼠标左键(或者 Ctrl+Alt + 上下按键)
  • 加选下一个同名名称:Ctrl + d ( + u 是选择上一个)

基础操作

  • 首先是F1/Ctrl+Shit+P万能键,谁用谁知道
  • Ctrl+G:跳转行号
  • Ctrl+P:文件切换
  • Ctrl + Shift + Tab 调出最近打开的文件列表
  • Ctrl + Tab 与上面一致,顺序不一致

  • Alt+↑↓:整行上下移动
  • Ctrl+↑↓:编辑器垂直滚动条上下移动,光标不动
  • Ctrl+Backspace/Delete:整词/连续空白删除
  • Ctrl+→←:光标整词移动

  • Ctrl+F查找/Ctrl+Shift+F在文件中查找(通用快捷键不再赘述)
  • F12/Ctrl+左键点击函数:跳转到定义
  • Shift+F12:预览定义

代码调试

  • F5:调试/继续,
  • F10:单步跳过,
  • F11:单步进入,
  • Shift+F11:跳出。
  • F9:切换断点

代码提示

  • Ctrl+空格:自动提示

集成终端快捷键

  • Shift + PgUp / PgDown: 页面上下翻屏
  • Ctrl + Home / End: 滚动到页面头部或尾部
  • Ctrl + Enter: 在下面插入新的一行
  • Ctrl + Shift + [ 折叠区域代码
  • Ctrl + Shift + ] 展开区域代码

插件介绍

  1. Python(必备)
    VScode自带的官方插件

  2. Anaconda Extension Pack
    可以自动补全anaconda包中的属性名称

  3. Code Spell Checker
    单词拼写检查,非常推荐,有时候会拼错单词,这个不仅可以指出错误,还能提供正确单词的拼写方式。
    安装好之后,选中拼写错误的单词,旁边出现黄色小灯泡,点击选择单词,直接替换。

  4. Autopep8/yapf
    自动格式化代码;(Alt + Shift + F)

  5. Settings Sync
    将VScode的配置上传到github,以后换机器,重装系统,随时下载,不用重新找教程了

  6. vscode-icons
    文件图标主题,能够让你的各种文件一目了然,不用再去看扩展名,而且超级好看

  7. SynthWave’84
    字体颜色主题,我个人非常喜欢的一套高亮字体方案

  8. koroFileHeader
    文件头注释(ctrl+alt+i) 和函数头注释(ctrl+alt+t)工具,一键生成头注释

  9. Markdown Preview Enhanced
    在VSCode中完美书写MarkDown和LaTex必备的预览插件

其它设置

隐藏菜单栏

这个属于个人习惯,如果你也感觉菜单栏很碍眼,可以点击查看->切换菜单栏,即可隐藏菜单栏。需要菜单栏的时候按Alt键即可查看

设置快捷键

文件->首选项->键盘快捷方式,将需要的修改的快捷键的整个大括号里面的内容复制到右边keybindings.json文件中,然后修改“key”的值为你需要的快捷键即可。我这边只修改了复制一行和删除一行的快捷键。

常用hexo命令

1
2
3
4
5
6
7
8
9
10
11
12
13
14
	·常见命令
hexo new "postName" #新建文章
hexo new page "pageName" #新建页面
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口(默认端口4000,'ctrl + c'关闭server)
hexo deploy #部署到GitHub
hexo help # 查看帮助
hexo version #查看Hexo的版本

·缩写
hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy

_config.yml

这里面都是一些全局配置,每个参数的意思都比较简单明了,所以就不作详细介绍了。

需要特别注意的地方是,冒号后面必须有一个空格,否则可能会出问题。

写博客

新建post or page

定位到我们的hexo根目录,执行命令:

hexo new 'my-first-blog'
hexo会帮我们在_posts下生成相关md文件:

我们只需要打开这个文件就可以开始写博客了,默认生成如下内容:

当然你也可以直接自己新建md文件,用这个命令的好处是帮我们自动生成了时间。

一般完整格式如下:

1
2
3
4
5
6
title: postName #文章页面上的显示名称,一般是中文
date: 2013-12-02 15:30:16 #文章生成时间,一般不改,当然也可以任意修改
categories: 默认分类 #分类
tags: [tag1,tag2,tag3] #文章标签,可空,多标签请用格式,注意:后面有个空格
description: 附加一段文章摘要,字数最好在140字以内,会出现在meta的description里面
---

以下是正文
那么 hexo new page ‘postName’ 命令和 hexo new ‘postName’ 有什么区别呢?

hexo new page "my-second-blog"
生成如下:

最终部署时生成:hexo\public\my-second-blog\index.html,但是它不会作为文章出现在博文目录。

如何让博文列表不显示全部内容

默认情况下,生成的博文目录会显示全部的文章内容,如何设置文章摘要的长度呢?

答案是在合适的位置加上

<!--more-->

即可。

Hexo中添加本地图片

First

1 把主页配置文件_config.yml 里的post_asset_folder:这个选项设置为true

2 在你的hexo目录下执行这样一句话npm install hexo-asset-image --save,这是下载安装一个可以上传本地图片的插件,来自dalao:dalao的git

3 等待一小段时间后,再运行hexo n “xxxx”来生成md博文时,/source/_posts文件夹内除了xxxx.md文件还有一个同名的文件夹

4 最后在xxxx.md中想引入图片时,先把图片复制到xxxx这个文件夹中,然后只需要在xxxx.md中按照markdown的格式引入图片:

![你想输入的替代文字](xxxx/图片名.jpg)

注意: xxxx是这个md文件的名字,也是同名文件夹的名字。只需要有文件夹名字即可,不需要有什么绝对路径。你想引入的图片就只需要放入xxxx这个文件夹内就好了,很像引用相对路径。

5 最后检查一下,hexo g生成页面后,进入public\2017\02\26\index.html文件中查看相关字段,可以发现,html标签内的语句是<img src="2017/02/26/xxxx/图片名.jpg">,而不是<img src="xxxx/图片名.jpg>。这很重要,关乎你的网页是否可以真正加载你想插入的图片。

Second

本地source中建立img文件夹

<img src="img/图片名.jpg>

这个比较方便

Third

图床,不太稳定。或者上传至七牛服务器。

Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.

Quick Start

Create a new post

1
2
$ hexo new "My New Post"
$ hexo n

More info: Writing

Run server

1
2
$ hexo server
$ hexo s

More info: Server

Generate static files

1
2
$ hexo generate
$ hexo g

More info: Generating

Deploy to remote sites

1
2
$ hexo deploy
$ hexo d

More info: Deployment

(っ•̀ω•́)っ✎⁾⁾ 坚持技术学习、内容输出与分享,您的支持将鼓励我继续创作!(*/ω\*)
( • ̀ω•́ )✧如有疑问或需要技术讨论,请留言或发邮件到 aclearzhang@qq.com.(*・ω< )