Search code examples
webstorm

Webstorm external libraries explanation


I read this page that explains what external libraries in Webstorm are, but I still have more questions: https://www.jetbrains.com/webstorm/help/configuring-javascript-libraries.html

Are external libraries only for code completion and help in production? Can they be used to link libraries for example in index.html? (Probably not, because they are not found in the project folder).

I guess my question is what are the external libraries for, other than what I said in the beginning?


Solution

  • Javascript libraries configured in Settings/Languages&Frameworks/javaScript/Libraries (and shown as external libraries in the Project window) have absolutely nothing to do with references in your <script> tag. The former are used by IDE for code completion/navigation/error highlighting, the latter are used by browser in runtime. The browser knows nothing about javascript libraries configured in IDE, the IDE doesn't use <script> references in your HTML files.

    Let me try to clear the things up:

    What libraries are supposed to be used for: by default, completion works for all JavaScript files located under your project root. So, if you do already have the library .js files in your project structure, it's enough to get the completion. If they are missing, and you don't like to clatter your project with all these files, you can store them externally (outside of your project) and configure them as libraries to make them available to WebStorm. Note also that libraries are 'light-weight' as compared to .js files in your project - they are treated as read-only and have inspections turned off. Plus, you can assign documentation URLs to them, enabling external documentation for library code. So, even if you have your library files in your project, it might make sense to add them as libraries

    So, to summarize:

    • library files placed next to your sources files in the project structure are available to both WebStorm and browser, whether or not they are added to javascript libraries in Settings

    • online library referenced via CDN link in your HTML is available to the browser at runtime, but can't be used for completion in the
      IDE

    • a library files placed outside of the project and configured as javascript libraries will be available to WebStorm for completion,
      but won't be loaded by a browser