title: Laravel 8 Summernote Jquery Errors
body: <p>I am trying to hook up summernote wysiwyg with Laravel 8, no matter what I do I am getting a constant jquery error. I have tried to use webpack for the scripts and added scripts directly to the page. The order to my scripts should be correct and I am executing the code after the scripts However, the error is a basic error and I can't nail down the issue.</p>
  <p>The webpack file is default and I have run npm run dev &amp; prod.</p>
  <p>The code listed put into a basic HTML file runs with no errors, there must be something I am doing with Laravel.</p>
  <pre><code>jquery.js:4055 Uncaught TypeError: &quot;#summernote&quot;.summernote is not a function
  </code></pre>
  <p>App.blade.php</p>
  <pre><code>&lt;head&gt;
      &lt;meta charset=&quot;utf-8&quot;&gt;
      &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1&quot;&gt;
  
      &lt;!-- CSRF Token --&gt;
      &lt;meta name=&quot;csrf-token&quot; content=&quot;{{ csrf_token() }}&quot;&gt;
  
      &lt;title&gt;{{ config('app.name', 'Laravel') }}&lt;/title&gt;
  
      &lt;!-- Scripts --&gt;
      &lt;script src=&quot;https://code.jquery.com/jquery-3.5.1.min.js&quot; crossorigin=&quot;anonymous&quot;&gt;&lt;/script&gt;
      &lt;script src=&quot;https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js&quot; integrity=&quot;sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo&quot; crossorigin=&quot;anonymous&quot;&gt;&lt;/script&gt;
      &lt;script type=&quot;text/javascript&quot; rel=&quot;script&quot; src=&quot;{{asset('js/app.js')}}&quot; &gt;&lt;/script&gt;
   
  
  
      &lt;!-- Fonts --&gt;
      &lt;link rel=&quot;dns-prefetch&quot; href=&quot;//fonts.gstatic.com&quot;&gt;
      &lt;link href=&quot;https://fonts.googleapis.com/css?family=Nunito&quot; rel=&quot;stylesheet&quot;&gt;
  
      &lt;!-- Styles --&gt;
      &lt;link href=&quot;{{ asset('css/app.css') }}&quot; rel=&quot;stylesheet&quot;&gt;
      &lt;link rel=&quot;stylesheet&quot; href=&quot;https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css&quot; integrity=&quot;sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh&quot; crossorigin=&quot;anonymous&quot;&gt;
  
  &lt;/head&gt;
  
  //rest of the template is out of the box Laravel base install with auth installed
  
     &lt;form method=&quot;post&quot;&gt;
              &lt;textarea id=&quot;summernote&quot; name=&quot;editordata&quot;&gt;&lt;/textarea&gt;
            &lt;/form&gt;
  
      &lt;script src=&quot;https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js&quot; integrity=&quot;sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6&quot; crossorigin=&quot;anonymous&quot;&gt;&lt;/script&gt;
      &lt;link href=&quot;https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.css&quot; rel=&quot;stylesheet&quot;&gt;
      &lt;script src=&quot;https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote-bs4.min.js&quot;&gt;&lt;/script&gt;
   &lt;script type=&quot;text/javascript&quot; rel=&quot;script&quot; src=&quot;{{asset('js/main.js')}}&quot; &gt;&lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>Main.js</p>
  <pre><code>jQuery(document).ready(function() {
  /* $('#summernote').summernote({
      placeholder: 'Hello Bootstrap 4',
      tabsize: 2,
      height: 100 */
  // Code still produces the error here 
  });
  
  });
  $('#summernote').summernote({
      placeholder: 'Hello Bootstrap 4',
      tabsize: 2,
      height: 100
  });
  // Code still produces the error here 
  </code></pre>
  <p>Happy to provide more information, help will be greatly appreciated.</p>