How to fight tons of unresolved variables warning in Webstorm?

I have a function that takes a data from server:

function getData(data){
    console.log(data.someVar);
}

Webstorm says that someVar - is an unresolved variable. What can I get rid of such warnings?

I see several options:

  • Suppress warnings in ide settings;
  • Add a json source file with fields (details);
  • Use arrays-like syntax: data['some_unres_var'];

Also Webstorm offering me to create namespace for the "data" (add an annotation like /** @namespace data.some_unres_var*/), create such field, or rename it.

Answers:

Answer

Use JSDoc:

/**
 * @param {{some_unres_var:string}} data
 */
function getData(data){
    console.log(data.some_unres_var);
}
Answer

JSDoc the object. Then its members.

/**
 * @param data          Information about the object.
 * @param data.member   Information about the object's members.
 */
function getData(data){
    console.log(data.member);
}
  • @property for local variables (non parameters)
  • Tested in PyCharm. @Nicholi confirms it works in Webstorm.
  • The {{ member:type }} syntax Andreas suggested may conflict with Django templates.
  • Thanks to Jonny Buchanan's answer citing the @param wiki.

To document arrays of objects, use [] brackets as JSDoc suggests:

/**
 * @param data
 * @param data.array_member[].foo
 */
Answer

All other answers are incorrect for the general case. What if you don't get data as a parameter? You don't have JSDoc then:

function niceApiCall(parameters) {
  const result = await ...  // HTTP call to the API here
  for (const e of result.entries) {
    .. // decorate each entry in the result
  }
  return result;
}

WebStorm will warn that "result.entries" is an unresolved variable (field).

The general solution is to add an @namespace declaration:

function niceApiCall(parameters) {
  /** @namespace result.entries **/
  const result = await ...  // HTTP call to the API here
  for (const e of result.entries) {
    .. // decorate each entry in the result
  }
  return result;
}
Answer

using a dummy js file with anonymous function expression returning the json literal, as written at http://devnet.jetbrains.com/message/5366907, may be a solution. I can also suggest creating a fake variable that will hold this json value, and use this var as a value of @param annotation to let WebStorm know what the actual type is. Like:

var jsontext = {"some_unres_var":"val"};
/** @param {jsontext} data
function getData(data){
    console.log(data.some_unres_var);
}

See also http://devnet.jetbrains.com/message/5504337#5504337

Answer

Destructuring use, Luke.

function getData(data){
    const {member} = data;
    console.log(member);
}
Answer

To remove the warnings on The WebStorm IDE you can simply uncheck the inspection options for:

  • Unresolved Javascript function
  • Unresolved Javascript variable

ps. this will remove the warnings on the IDE, but I don't think that is the best idea, because we will lost one of the best utilities in a IDE like Webstorm, which can worsen the quality of our code.

Even so, if you want to follow in the menu: File > Settings > Editor > Inspections we can disable the Javascript warnings

Like the following picture:

uncheck options

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.