V Jump

An awesome Visual Studio Code extension that allows you to swiftly navigate between <template>, <script>, and <style> in Vue SFC, saving your mouse wheel for a smoother coding experience

一个方便你在写Vue SFC时，能快速在 <template>, <script> 和 <style> 代码块中跳转的Visual Studio Code 插件.

Usage

We provide two types of quick navigation: Press the F1 key or Ctrl + Shift + P to bring up the command palette, and then type one of following keyword likes jump to template focus or even jttf to jump. Alternatively, setting shortcuts like Ctrl + 1, Ctrl + 2, etc., would be more efficient.

1. Jumping to the beginning of code blocks:

   • Jump to template: Jump to the beginning of the <template> code block.
   • Jump to script: Jump to the beginning of the <script> code block.
   • Jump to style: Jump to the beginning of the <style> code block.
   • Jump to imports: Jump to the last import statement of the <style> code block.

2. The extension records your last mouse position in each module, making it convenient to jump to the previous code block's focus position after switching between code blocks:

   • Jump to template Focus: Jump to the previous focus position in the <template> code block.
   • Jump to script Focus: Jump to the previous focus position in the <script> code block.
   • Jump to style Focus: Jump to the previous focus position in the <style> code block.

使用方法

提供两类快捷命令用于跳转, 按 F1 键 或者 Ctrl + Shift + P，调出命令选项板，输入关键字即可跳转，比如要跳转到前一次template中的光标位置，可以输入 jump to template focus, 或者简写 jttf。。当然，设置为 Ctrl + 1, Ctrl + 2 这样的快捷键会更加高效。

1. 跳转到代码块起始位置：
   • Jump to template: 跳转到 <template> 代码块开始位置
   • Jump to script: 跳转到 <script> 代码块开始位置
   • Jump to style: 跳转到 <style> 代码块开始位置
   • Jump to imports: 跳转到 <style> 最后一个import下一行， 方便添加新的导入项
2. 插件记录了你在每个模块中上一次的鼠标位置，方便切换了代码块后跳转到上一个代码块中的光标位置
   • Jump to template Focus: 跳转到前一次 <template> 代码块中的鼠标焦点位置
   • Jump to script Focus: 跳转到前一次 <script> 代码块中的鼠标焦点位置
   • Jump to style Focus: 跳转到前一次 <style> 代码块中的鼠标焦点位置

License

MIT License © 2022 Kevin Law