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
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