Laravel Mix 和 Turbolinks

Tim*_*Tim 5 javascript jquery turbolinks bootstrap-4 laravel-mix

我在 turbolinks 设置方面遇到了一些问题。这是设置:Laravel Mix - 默认值:bootstrap,jquery,..)。就在 bootstrap.js 文件之后,我包含了 turbolinks。一切正常,直到页面重新加载 - 我总是出错。我究竟做错了什么?

错误:

app.js:1282 Uncaught TypeError: $ is not a function
    at HTMLDocument.<anonymous> (app.js:1282)
    at Object.push../node_modules/turbolinks/dist/turbolinks.js.e.dispatch (vendor.js:105933)
    at r.notifyApplicationAfterPageLoad (vendor.js:105934)
    at r.visitCompleted (vendor.js:105934)
    at r.complete (vendor.js:105933)
    at r.<anonymous> (vendor.js:105933)
    at vendor.js:105933
Run Code Online (Sandbox Code Playgroud)

有错误的行:

document.addEventListener('turbolinks:load',function() {
    new SimpleBar(document.getElementsByClassName("js-simplebar")[0]);
    $(".sidebar-toggle").on("click", function() {
        //...
    });
});
Run Code Online (Sandbox Code Playgroud)

编辑这里是 js 包括(编译 - Laravel Mix)

<head>
<script defer src="/js/manifest.js" data-turbolinks-track="true"></script>
<scrip`enter code here`t defer src="/js/vendor.js" data-turbolinks-track="true"></script>
<script defer src="/js/app.js" data-turbolinks-track="true"></script>
</head>
Run Code Online (Sandbox Code Playgroud)

这是我的 app.js:

require('./bootstrap');
let Turbolinks = require('turbolinks');
Turbolinks.start();

require("./dashboard");
require('./custom/INotifier').run();

require("./theme/bootstrap");
require("./theme/theme");
Run Code Online (Sandbox Code Playgroud)

和 bootstrap.js(包括 jQuery、bootstrap js、axios……)

try {

window.Popper = require('popper.js').default;
window.$ = window.jQuery = require('jquery');
require('bootstrap');

} catch (e) {}

window.axios = require('axios');

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
Run Code Online (Sandbox Code Playgroud)

小智 0

在您显示的错误中,写到Uncaught TypeError: $ is not a function此错误主要是在调用 jquery 的脚本之前未定义 jquery 时发生的。

通过下载jquery或通过cdn在脚本之前添加jquery在headhtml中turbolinks

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
Run Code Online (Sandbox Code Playgroud)