Feature request: OctoLinker-like navigation within project via links in JavaScript

[core-ai-bot]

Issue by petetnt Thursday Jan 19, 2017 at 16:39 GMT Originally opened as https://github.com/adobe/brackets/issues/13053

---

This issue is a feature request / extension idea for a OctoLinker like interface for quickly opening files from within JavaScript (or other files).

If you aren't familiar with OctoLinker it works something like this:

1. Search for imports / requires / other links within the document, examples:

const foo = require("./foo"); // foo.js in the same folder
import foo from "./foo" // foo.js in the same folder
const bar from "../../bar/bar"; // relative link
const handlebars = require("handlebars"); // npm module called handlebars
import handlebars from "handlebars"; // npm module called handlebars

2. Hover over the link part ("./foo", "handlebars" (optionally while holding a button) and it should appear as clickable link

3. Click on the link and it

   • Opens the file in Brackets if it's a relative import
   • Open the module in npmjs.com if it's absolute import (eg. https://www.npmjs.com/package/handlebars)

[core-ai-bot]

Comment by swmitra Saturday Jan 21, 2017 at 05:24 GMT

---

Interesting feature@petetnt. I always wanted this feature to be available at least for HTML files. This can be extended to pretty much all language types to ease up the document navigation. I hope someone should pick it up or else we have to start working on it 😊

[core-ai-bot]

Comment by justinrusso Thursday Mar 30, 2017 at 11:12 GMT

---

I might give this a try, seems like a great addition. I'd imagine this would be considered a default extension.. how does LinkParser sound?

I'm thinking not only for require/imports, but even the ability to click on a link in the code, like "github.com". Also, should it be bound to a keybind? I've used editors with a feature like this before, and they used (hold) Ctrl + click. I noticed in Brackets holding the Ctrl key gives you the option to edit multiple spots in the text at once.

[core-ai-bot]

Comment by petetnt Thursday Mar 30, 2017 at 11:18 GMT

---

@justinrusso that sounds great 👍 Some links are already parsed (like images inline) so that might be good starting point on how to add this feature for code imports and such.

I think the best start would be handling ES6 imports and CommonJS imports in the filesystem and continuing with that.

[core-ai-bot]

Comment by justinrusso Thursday Mar 30, 2017 at 11:22 GMT

---

That'll be useful! Do you know where the image parsing is located? Thanks!

[core-ai-bot]

Comment by justinrusso Thursday Mar 30, 2017 at 16:28 GMT

---

Should npm modules go to npmjs.org or should they link to the src inside node_modules?