IDEA - Javascript Dev

> Integrated development environment (ide) > IntelliJ - IDEA

1 - About

A javascript Project is a Static Web project.

You need to define the JavaScript libraries as dependency.

3 - Debug

The debug session is based on the chrome debug mode.

If you choose:

  • locally, Idea will start a server for you and start a chrome page
  • remote, Idea will install the file remotely and start a chrome page

See Debugging

Advertising

4 - Configuration

4.1 - Plugin

4.1.1 - Idea

JavaScript Support plugin is bundled with IntelliJ IDEA and activated by default

  • Live Edit Plugin

4.1.2 - Chrome

  • Chrome Plugin Intellij

4.2 - Grammar / Version

Settings (Ctrl + Alt + S) > Javascript Filtering > Language and Frameworks > Javascript > grammar

4.3 - Third Party Library

A Javascript - (Library|Package) in IDEA is a set of files and folders that is:

  • write-protected,
  • excluded from check for errors
  • and refactoring,

It only affects the completion list and highlighting.

Advertising

4.3.1 - Download

  • From the code

  • From the settings

4.3.2 - Scope

By default, all predefined libraries and libraries are treated as libraries in any file within the project. Their usage scope is the whole project.

Project Libraries are not considered libraries in any of the files unless you attach their scope to a file explicitly.

  • From Code:

  • From Settings:

4.3.2.1 - Global

4.3.3 - Documentation

Advertising

4.3.4 - DefinitelyTyped

Typescript definition files provide code completion for Javascript.

Preferences | Languages & Frameworks | JavaScript | Libraries – click Download and search for the library

Intellij will mark properties of unknown data structure as unresolved – that typically happen in ajax callbacks, so it might be a good idea to use @typedef or custom definition (*.d.ts) file to describe that structure

4.4 - Documentation

  • Without any library (no auto-completion, no navigation, no documentation)
  • With a library (better auto-completion) via Javascript - JsDoc
  • With .d.ts typing as a library

IntelliJ IDEA creates stubs of JSDoc comments on typing the opening tag /** and pressing Enter

4.5 - Type Definition in the documentation

/**
 * Test interface
 * @typedef {Object} Type
 * @property {String} tString - I'm a string
 * @property {Boolean} tBoolean - I'm a boolean
 * @property {Number} [tNumber=100] - I'm a number with a default value of 100
 * @property {Function} tFunction - I'm a function
 */

or

/* global d3 */
/* global $ */

or

/**
 * @param {Type} someParam
 * @return {undefined} 
 */
function testFunction(someParam) {
  //
}
/**
 *  @class MyView
 *  @augments Backbone.View
 *  @static 
*/

In intellij 11 there are three ways to express typeof type:

{typeof someVar} // TypeScript's way
{someVar.} // Google Closure Compiler's team suggestion
{someVar.prototype.constructor} // this ticket's suggestion

5 - Documentation / Reference

ide/idea/javascript.txt · Last modified: 2019/02/16 17:40 by gerardnico