npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

angular-click-to-code

v0.0.1

Published

Redireciona para o codigo ao clicar ALT ou ALT + SHIFT

Vulnerabilities

Powered byPowered by Snyk
  • 0High
  • 0Medium
  • 0Low

Links

Maintainers

viniciusschimidtviniciusschimidt

Keywords

Readme

Angular Clicker: Angular Click-to-Code

Version: Portugues Espanhol Ingles

Portugues

Sumario: Visao geral | Recursos | Requisitos | Configuracao automatica | Uso manual | Comandos | Fluxo tecnico | Limitacoes | Notas de versao

Visao geral

Extensao para projetos Angular 8+ (View Engine) que abre o arquivo do componente no VS Code ao clicar com ALT no navegador.

Recursos

  • Abertura de arquivo e linha via protocolo vscode://.
  • Atalho ALT para HTML e ALT + SHIFT para preferir arquivo .ts.
  • Comando de setup que injeta configuracao de build e inicializacao do inspector.

Requisitos

  • Projeto Angular 8+.
  • ng serve em ambiente de desenvolvimento.
  • Uso de @angular-builders/custom-webpack para injetar data-source-path.

Configuracao automatica

  1. Abra o projeto Angular no VS Code.
  2. Execute Angular Clicker: Setup Angular Project.
  3. Rode npm install e reinicie o ng serve.

Uso manual

O inspector no navegador destaca o elemento com ALT e envia o caminho do arquivo via vscode://.

Comandos

  • Angular Clicker: Open File.
  • Angular Clicker: Setup Angular Project.

Fluxo tecnico

  1. O build injeta data-source-path nas tags HTML.
  2. O injector.js captura ALT + clique e redireciona para o VS Code.
  3. A extensao abre o arquivo e posiciona o cursor na linha informada.

Limitacoes

  • Nao funciona em producao.
  • Depende de configuracao do build para injetar data-source-path.

Notas de versao

  • 0.0.1 Configuracao inicial do handler e do setup.

Espanhol

Sumario: Resumen | Funciones | Requisitos | Configuracion automatica | Uso manual | Comandos | Flujo tecnico | Limitaciones | Notas de version

Resume

Extension para proyectos Angular 8+ (View Engine) que abre el archivo del componente en VS Code al hacer clic con ALT en el navegador.

Funciones

  • Apertura de archivo y linea via protocolo vscode://.
  • ALT para HTML y ALT + SHIFT para preferir .ts.
  • Comando de setup que inyecta configuracion de build e inicializacion del inspector.

Requisitos

  • Proyecto Angular 8+.
  • ng serve en entorno de desarrollo.
  • Uso de @angular-builders/custom-webpack para inyectar data-source-path.

Configuracion automatica

  1. Abra el proyecto Angular en VS Code.
  2. Ejecute Angular Clicker: Setup Angular Project.
  3. Ejecute npm install y reinicie ng serve.

Uso manual

El inspector en el navegador resalta el elemento con ALT y envia la ruta via vscode://.

Comandos

  • Angular Clicker: Open File.
  • Angular Clicker: Setup Angular Project.

Flujo tecnico

  1. El build inyecta data-source-path en las etiquetas HTML.
  2. injector.js captura ALT + clic y redirige a VS Code.
  3. La extension abre el archivo y posiciona el cursor en la linea indicada.

Limitaciones

  • No funciona en produccion.
  • Depende de la configuracion del build para inyectar data-source-path.

Notas de version

  • 0.0.1 Configuracion inicial del handler y del setup.

Ingles

Sumario: Overview | Features | Requirements | Automatic setup | Manual usage | Commands | Technical flow | Limitations | Release notes

Overview

Extension for Angular 8+ (View Engine) projects that opens the component file in VS Code when you ALT-click in the browser.

Features

  • File and line opening via vscode://.
  • ALT for HTML and ALT + SHIFT to prefer .ts.
  • Setup command that injects build config and inspector initialization.

Requirements

  • Angular 8+ project.
  • ng serve in development.
  • @angular-builders/custom-webpack to inject data-source-path.

Automatic setup

  1. Open the Angular project in VS Code.
  2. Run Angular Clicker: Setup Angular Project.
  3. Run npm install and restart ng serve.

Manual usage

The browser inspector highlights the element with ALT and sends the path via vscode://.

Commands

  • Angular Clicker: Open File.
  • Angular Clicker: Setup Angular Project.

Technical flow

  1. The build injects data-source-path into HTML tags.
  2. injector.js captures ALT + click and redirects to VS Code.
  3. The extension opens the file and positions the cursor at the line.

Limitations

  • Does not run in production.
  • Requires build configuration to inject data-source-path.

Release notes

  • 0.0.1 Initial handler and setup.