coderallan / vscode-angulartools Goto Github PK

While the graphs for the module hierarchy / component hierarchy / dependency injection are already quite useful, I image that being able to document the relationship (and have the graph generator add it as label to the edges of a graph would be very useful.

Exemplary, in a component hierarchy graph, component A includes components B and C. But what the graph does not show (yet), is that A only includes B or C on specific conditions. For instance, B might only be included if the user is logged into the application, otherwise C is included.

I don't have a concrete implementation approach for you, but it would be nice if a developer could somehow add this piece of knowledge (in the form of a simple string). For instance, for the component hierarchy, as a developer I would be fine with adding TSDoc to my component classes, and have AngularTools looks for a specific keyword, e.g. @linksto <name of other component> - <text describing the relation>, which it uses to enrich the links (graph edges) that it detects as usual.

I have a monstrous Angular app. The component hierarchy errors out due to stack size. There's a way to exclude folders, could we have a way to 'include' folders? If set, then only those folders are scanned.

Hi, I'm trying the extension on a Linux system and launching the "Show a graph representing the module hierarchy" I got a popup with the following sort of error (exactly as I see it with respect to linebreaks):

A system error occured (ENOENT: no such file or directory, scandir '/-
home/paofos/work/gitrepos/proj-name/src/appname')

The folder does exist but it is

home/paofos/work/gitrepos/proj-name/src/appName (please note the difference in caseness)

Thank you

Hi,
I'm experimenting with your extension. A command i just tried was "Show the project structure".
In the AngularTools Output-window i get the output of something like a "dir/ls"-command. Ok, it does work. Good!

But is it expected that the "node_modules"-folder and ".git"-folder is part of the output? As i'm using NX, i also see folders like "tmp" and "coverage". This all ain't wrong, but i'm just having a hard time to understand the intentions of the "Show the project structure"-command.

Maybe it would be good to filter the project-structure using the .gitignore file?

thanks!

Hi,

I'm trying to test vscode-angulartools in my angular app and found out that what's breaking it is this "toLowerCase()" here:

Thanks.

Hi Allan, your plug-in really helps to visualize dependencies in Angular projects. I particularly like the component hierarchy graph. I noticed, however, that if a component internally uses other components indirectly, via having a <router-outlet></router-outlet> in its HTML template (and routes defined in, say, the AppRoutingModule), then this dependency is missing from the component hierarchy graph.

Do you see a way to also include these indirect dependencies?

This has been a long wanted feature as you can see here: microsoft/vscode#30075

In the same thread, they said they have introduced a API which extension can use.

Can you please include it as a feature in your Extension? It will be greatly appreciated.

In the corporate world, making sure all packages are open source is very important, adding a "License" column in the Package List would be amazing and help us see the licenses at once.

Hi,
I saw a collegue of mine using your AngularTools-extension on Visual Studio .NET. It looked very interesting and powerfull, but i use VSCode. I installed the extension on my VSCode, without any errors. But unfortunately none of the AngularTools actions do something. I also didn't see any error-messages appear.

The details of my machine:

• VSCode v1.86.1
• AngularTools extension v1.13.0
• AngularTools extension enabled on the Remote-WSL-environment
• Repository a NX-workspace (integrated monorepos)

Hey Allan,

I've been using your plugin to great effect. The dependency injection graph is a great aid for refactoring.

One feature I'm missing is showing the dependency injection between services (i.e., when one service injects another service). It would be very useful to understand these dependencies as well in my projects.

First of all I must say this plugin is awesome.

This is a feature request.
A very useful feature in my opinion is a dependency injections tree for components and services.
Sorry about my limited drawing skills

Thanks!

Using the example application: https://github.com/DanWahlin/Angular-JumpStart

When hovering over a service node in the graph it shows the filename of one of the components its injected into, not the filename of the service itself.

When trying to generate a component hierarchy, I get an error about max call stack size exceeded.

Here is the VS code notification message:

Error loading webview: Error: Could not register service worker: InvalidStateError: Failed to register a ServiceWorker: The document is in an invalid state..

I cant get this extension to work in the latest Visual Studio Code. I install it, but doesnt see its symbol (should there be one?) in the left margin, and can't find any other way to access it whatever I try.
I have the Angular Language Service extension installed. Could that be the problem?