Please provide autocomplete for <reference> and import paths

[NoelAbrahams]

Hi,

Visual Studio (2013 Ultimate) provides intellisense for the src attribute for script elements, by reading the file system and displaying available files or folders.

It will be quite useful if similar functionality can be provided for <reference> and import statements:

 <reference path="foo/    <--- here

import foo = require('foo/   <--- and here

[basarat]

👍

[basarat]

@NoelAbrahams btw resharper will do that for you :

[NoelAbrahams]

@basarat, interesting. Never used resharper and don't think that's going to change. So for anti-third party tool people like myself I hope this will go into the VS plugin. 😄

[DanielRosenwasser]

👍

[basarat]

@NoelAbrahams btw atom-typescript will complete your references : https://github.com/TypeStrong/atom-typescript#relative-paths

and even autocomplete external module "name" and "./path"s 🌹

[DanielRosenwasser]

I don't know whether @ahmad-farid has actually gotten the chance to start on this, but @basarat, is this functionality something you think you could potentially contribute to TypeScript itself, or is it more tightly coupled to atom-typescript?

[basarat]

is it more tightly coupled to atom-typescript

Tightly coupled in that I do poor tokenization to detect these :
https://github.com/TypeStrong/atom-typescript/blob/d5fb4707b989f15d3be8d57cfa28d88af50b4702/lib/main/atom/typescriptGrammar.ts#L68-L76

The code to get these results is a bit simpler

• relative paths for reference / imports : https://github.com/TypeStrong/atom-typescript/blob/d5fb4707b989f15d3be8d57cfa28d88af50b4702/lib/main/lang/projectService.ts#L865-L871
• external modules names lookup : I actually asked and got this simple function : Question: Lookup external module names #2593 (comment)

Doesn't have to be tightly coupled. But that's just how I wrote it as a TypeScript consumer and there can't be a copy paste PR.

If someone were to PR this they would do the am I in a reference comment/import string? detection on getCompletionInfo and then do the lookups there.

Also more possible hoops : #2173 (comment)

[gautamsi]

Can you not drag and drop for that seems far easier.

for import autocomplete I would suggest having another feature like "Copy Import Reference" in solution explorer right click on file and then paste this in file which would write like 'import fileName = require("../dir/filename");'. This should keep track of relative paths and file name casing.

if someone can guide me where should I look for it in this source, I can try to add on.

[danquirk]

The Visual Studio related code you would need to modify to make changes like this aren't open source at the moment.

We actually had drag and drop /// reference generation at some point but it's highly undiscoverable and doesn't scale very well (do you really want to drag and drop 5+ items from disparate parts of your solution in folders that may be closed in solution explorer?).

In any case, those sorts of interactions would be nice but it should also be easier to do in a keyboard focused workflow which autocomplete would help with.

[alexeagle]

we have so many modules that walking the filesystem is not practical, and some of them are generated external module names, not files. So we would like to run a periodic indexing, and then somehow provide a list of these to the language services (eg. an RPC, or a file we stage on local disk, etc.)

[olmobrutall]

+1 having auto-complete on import will be awesome.

[billti]

Still seeing a lot of requests for this, especially as now with VSCode and Salsa this is effectively a regression (i.e. they used to give completions on require for modules). I believe some non-Microsoft editors also provide support for this in TypeScript/JavaScript already. We should consider pulling this in (ping @mhegazy ).

[daslicht]

any news on this ?

[mhegazy]

any news on this ?

working on it. but nothing to report.

[Ciantic]

Has there been agreement how this should work for imports?

I imagine this would be a nice user experience: in VS Code if I hit Ctrl+T (Type to search symbols project wide), and choose a symbol it would allow me to somehow generate import statement for it.

Tiny bit related, some reason the project wide symbol listing does not show me exported variables, e.g. export let globalStyles = {} but it appears within file symbol listing. Project wide symbol listing must show all symbols to make it work as import GUI.

[caseyhoward]

@Ciantic That sounds good. I would rather have it when using Intellisense it automatically imports things that it autocompletes that aren't in scope. I would also like the option to clean up unused imports or either further functionality for sorting them. Another thing that would be nice is something like if you delete the last usage of something imported, the import statement gets removed.

[Sammons]

I built this to stopgap the problem for myself https://marketplace.visualstudio.com/items?itemName=Sammons.ts-import-assistance, code is here: https://github.com/Sammons/ts-import-assistance. It is not super intelligent but it does what I need. Essentially I found no easy way to see which symbols were missing in the current document - so this is a command you can execute to search for and import the symbol you have highlighted.

This just builds on top of the built in symbol search.

[Taytay]

I also came across and used this VS Code Plugin to help in the meantime:
https://marketplace.visualstudio.com/items?itemName=steoates.autoimport

It helped tremendously when I was switching a project from namespaces (internal modules) to external modules.

[rolandoldengarm]

@Taytay Thanks, tried it, but it's causing my VS Code to hang.. Maybe my app is too big, but it's useless to me.

[Taytay]

Oh dang @rolandoldengarm. Understood. (For what it's worth, I've found the author to be responsive in issues in case you want to pursue it.)

[buehler]

@Taytay Thanks for the info, but I made my own extension ;-) currently I'm rewriting the logic to make it faster. I'm not using regex to parse through the files (like many others do), but use the typescript compiler to generate the AST of the source.
If you're interested, you'll find it here: https://marketplace.visualstudio.com/items?itemName=rbbit.typescript-hero

[iRoachie]

@buehler This works great! Had no problems as yet. Definitely much faster than typing it all out.

[zpdDG4gta8XKpMCd]

please what is the status of it? roadmap has it checked, but the nightly build doesn't show it

[mhegazy]

how are you using the nightly build?

[daslicht]

@mhegazy http://rostacik.net/2015/09/04/using-typescriptnext-nightly-package-dont-rely-on-save-dev-to-be-up-to-date/

[zpdDG4gta8XKpMCd]

@mhegazy i am using VSCode with the

    "typescript.tsdk": "./node_modules/typescript/lib",

in the .vscode/settings.json pointing to the nightly build npm package (latest just updated)

there is no autocomplete for the module paths for imports

as you can see the autocomplete only shows an already seen text token not a name of a file on disc

[vlechemin]

It works with relative paths, but not with "absolute paths" (combination of baseUrl and paths).
Any solution or work around to this problem?
Thanks