How to use WebStorm to develop Chrome extensions?

Question

I just bought WebStorm 5 and still really enjoyed its inspection features. One problem that I encountered while developing the Chrome extension is that it does not recognize the chrome variable:

Is there a way to add the chrome variable to the Inspector so that it can autocomplete upon input? I guess I need to add Chromium as an external library, but I'm not sure where to start.

Answer 1

First time setting

• Open the Settings dialog box ( File > Settings )

• Click Languages & Frameworks > Javascript > Libraries

• Click Download

• Make sure TypeScript community stubs selected

• Select chrome from the list (you can quickly find it by simply typing chrome )

• Click Download and Install

• Click OK to close the settings dialog.

---

Steps 2-6 shown below:

---

In subsequent projects

In any subsequent project, you simply:

• Open the Settings dialog again ( File > Settings )

• Click Languages & Frameworks > Javascript > Libraries again

• Check chrome-DefinitelyTyped

• Click OK to close the dialog box.

---

Steps 2-4 shown below:

Answer 2

UPDATE 2 :

Now it is supported out of the box, see full answer below .

UPDATE

There is a more complete stub file that you can add as a library to get the code. This is part of the Closure Compiler project. Download chrome_extensions.js .

See also the feature request for WebStorm to automatically add this library from the IDE.

---

You need to get the JavaScript library for the Chrome API, or use a stub to get the base termination .

You can configure a library or stub in WebStorm .

---

I found JSON files with extension APIs . You can write a script that will create JS stubs from these JSON files, stubs may look like the basic version associated with GitHub above, but with automatic generation they will contain almost full API and JSDoc comments, so the documentation like here can be viewed directly in the IDE.

JSON => Displaying stubs of JavaScript objects is quite simple in this case, and for recording this type, the converter should not take more than one day (or several hours for an experienced encoder).

If someone goes ahead and implements it, send a link to the results here.

Answer 3

WebStorm should one day accept json definitions directly to enable autocompletion for certain functions. Meanwhile, you can use the program https://github.com/QuickrWorld/jsgen to convert json files to js to enable autocomplete for chrome APIs.

Answer 4

For writing AppScript, functions and classes, such as DriveApp , SpreadsheetApp , there is a plug-in in WebStorm or Intellij called google-app-script.
The installation method is the same as above. On the other hand, you should mark or open the .gs file as JavaScript. (July 2017)