Vscode Vue Peek screenshot

Vscode Vue Peek

Author Avatar Theme by Fuzinato
Updated: 21 Aug 2017
52 Stars

Visual Studio Code extension for peeking to component files in Vue projects

Overview

The vscode-vue-peek extension is a powerful tool for anyone working with Vue.js in Visual Studio Code. It enhances the development experience by providing seamless navigation between components and their corresponding files, making it easier to manage single-file components (.vue). With features like Go To Definition and Peek Definition, this extension significantly streamlines the coding process, allowing developers to focus more on building and less on searching for code.

This extension also brings useful capabilities for CSS files, making it versatile for both Vue components and styling. Whether you’re a seasoned developer or just starting with Vue, vscode-vue-peek can greatly improve your productivity and workflow within the IDE.

Features

  • Go To Definition: Jump directly to a component file or open it in a new editor with a simple key press (F12).
  • Peek Definition: Load the CSS file inline, allowing quick edits without leaving your current view (Ctrl+Shift+F12).
  • Enhanced CSS Support: Access symbol definitions for CSS selectors, including classes and IDs, to enhance your workflow.
  • Customization Options: Add support for any file extension, such as .js, by adjusting the settings in the extension configuration.
  • Cross-Language Support: Activate the plugin for other programming languages by adding their extensions to the supported languages array.
  • Intuitive Hover Feature: View the definition of symbols on hover, providing immediate context without disrupting your coding flow (Ctrl+hover).
  • Active Development: Regular updates and contributions are welcomed to enhance the extension’s capabilities and user experience.