如何让 jQuery 在 ES6 文件中正常工作答案

【问题标题】：How do I make jQuery work correctly in an ES6 file如何让 jQuery 在 ES6 文件中正常工作
【发布时间】：2019-06-26 09:04:49
【问题描述】：

我还不明白为什么 jquery 不能在我的课堂上工作，有人有想法吗？

我使用 jQuery 3.4.0、Laravel-mix 'app.js'（如果在 jQuery(document).ready(function ($) {}); 中调用 jQuery，会正确加载 jQuery）和 bootstrap.bundle.min.js

var NavbarComponents = function() {
  var _componentSelect2 = function() {
    if (!$().select2) {
      console.log('Warning - select2.min.js is not loaded.');
      return;
    }
  }

return {
  init: function() {
    _componentSelect2();
  }
}
}();

document.addEventListener('DOMContentLoaded', function() {
  NavbarComponents.init();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.7/js/select2.min.js"></script>

例如，这个 $ 函数不起作用，我得到一个“函数未定义错误”。

<head>
  <!-- Laravel mix file -->
  <!-- <script src="{{ asset('js/app.js')}}" defer></script> -->

  <!-- Core JS files -->
  <script src="{{ asset('plugins/jquery/jquery-3.4.0.min.js') }}"></script>
  <script src"{{ asset('plugins/bootstrap/js/bootstrap.bundle.min.js') }}"></script>

  <!-- Theme file -->
  <script src="{{ asset('plugins/select2/js/select2.min.js')}}"></script>

  <!-- The custom js script -->
  <script src="{{ asset('js/admin/navbar_components.js')}}"></script>
</head>

从 CDN 加载最新的 jQuery 版本也不起作用。

这很有效

Jsfiddle

【问题讨论】：

并右键view-source查看脚本标签是否正确
如果您的代码在app.js 文件中，那么您需要将该引用放在之后 jquery-3.4.0.min.js
把$换成jQuery怎么样？
app.js文件是一个laravel核心文件，加载axios、jquery等东西
@Pinetree 这不起作用。一个有趣的事实，jquery 在我的另一个项目中工作，它使用 laravel 和 react。

标签： javascript jquery laravel ecmascript-6 laravel-5.8

【解决方案1】：

我在我的文件中加载了带有 jquery 的数据表愚蠢的错误，因为现在我使用了两次 jquery。

抱歉，感谢您的宝贵时间！

【讨论】：

请接受您自己的答案，以便我们看到问题已经解决。