title: WebStorm ReferenceError: $ is not defined
body: <p>So I got this error when compiling in WebStorm:</p>
  
  <blockquote>
    <p>(function (exports, require, module, __filename, __dirname) { $(function () {</p>
    
    <p>ReferenceError: $ is not defined </p>
  </blockquote>
  
  <p>It seems like jQuery isn't loading properly. Here is my HTML:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;title&gt;Title&lt;/title&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt; 
      &lt;/script&gt;
      &lt;script type="text/javascript" src="AlexTypescript.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div&gt;
          &lt;button id="BtnBC"&gt;
              Change BC
          &lt;/button&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>and here is my function:</p>
  
  <pre><code>$(function () {
      $("#BtnBC").on("click", function () {
          $("body").css("background-color", "black");
      });
  });
  </code></pre>
  
  <p>I created a simple button to check if it is functional at all. It is. I just get an error message when compiling in WebStorm.</p>
  
  <p>What I did so far:</p>
  
  <pre><code>1) Clean installation of the IDE, nodejs, modules etc.
  2) Checking the referenced path of jQuery and that it is loaded before the .js file
  3) Referencing a local jQuery installation as well as the CDN
  4) Writing jQuery instead of $
  </code></pre>
  
  <p>I'm fairly new to coding, so I would really appreciate some help :)</p>