10

I've been building an Angular 2/Typescript project in Visual Studio Code, and assiduously adding JSDoc comment blocks, but I'd now like to view the JSDoc output. I could install and set up my own JSDoc generation system, but given all the nice GUI support in VSC it seems reasonable to be able generate and view the JSDoc right from VSC.

My Google-Fu has been failing me; every time I look for "Generating JSDoc Output within Visual Studio Code" I just get plugins to generate JSDoc comment blocks.

Are there methods of generating and viewing JSDoc output within Visual Studio Code?

Improve this question
3
  • have you checked out npmjs.com/package/tsdoc? Commented Jul 12, 2017 at 11:14
  • Or... typedoc.org/api - Don't see any extensions per say to do what can be done from terminal though... Commented Jul 13, 2017 at 9:01
  • Press Ctrl+Shift+O for viewing all the methods and corresponding JSDoc opens up when you select a method there and hover over the method. Commented Jul 16, 2017 at 18:56

2 Answers 2

Reset to default
5
+100

AFAIK there is no built in support, but I don't think it's necessary, as you could easily add a task that would run the appropriate jsdoc command. I don't know if this is what you mean by "setting up your own JSDoc generation system", but it's done quickly:

  1. First install the jsdoc generator from the terminal: npm install -g jsdoc (assuming you have node.js / npm).
  2. Decide which arguments you need for jsdoc (see https://jsdoc.app/about-commandline)
  3. Set up a task (e.g. from the menu: Tasks -> Configure Tasks) - see https://code.visualstudio.com/Docs/editor/tasks for more info (you can even add a keyboard shortcut)
  4. Open the generated html-page with your JSDocs.
Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

Thanks: best answer.
3

The place I've found the jsdocs helpful within vscode is for intellisense.

Say I have this function

/**
 * This squares a function
 * @param x takes this value and doubles it
 */
function myAwesomeFunction(x: number) {
  return x *x;
}

Then vscode will show me this descriptive jsdocs whenever I try and call the function.

enter image description here

Improve this answer

1 Comment

Good information, and I knew that, but it's really the answer to a different question (which I'll probably be asking someday). Thanks!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.