Verwenden von Laravel Mix um js Abhängigkeiten zu enthalten

Question

Ich kann nicht wirklich meine js Bibliotheken zu arbeiten, vor einiger Zeit entschied ich mich für eine separate js-Datei für jede Bibliothek, die ich benutze (also ich habe eine jquery.js-Datei und ein Bootstrap Js-Datei in meinem Layout enthält), war alles funktioniert ganz gut, bis ich musste jquery-ui zu diesem Chaos, und hatte diesen Fehler

Uncaught TypeError: $(...).slider is not a function 

bis i geladen, jQuery und jQuery-ui in der gleichen Datei hinzufügen Das Problem ist, dass ich jquery ui nicht einschließen will, überall, wo ich jquery einschließe, weil ich es nur in 2 Seiten benutze. Im Folgenden werde ich meinen Code setzen:

jquery-ui.slider.js:

require('jquery-ui/ui/widgets/slider'); 
require('./components/carFilter.js'); 

app.js:

window.$ = window.jQuery = require('jquery'); 
require('./bootstrap'); 

webpack.mix.js:

mix.js('resources/assets/js/app.js', 'public/js') 
mix.js('resources/assets/js/jquery-ui.slider.js', 'public/js'); 

ich folgende npm Module bin mit:

• Bootstrap-Sass
• jquery
• jquery-ui

Answer 1

Ich landete nur um eine Datei zu erstellen, wo ich erfordern jquery, bootstrap.js und dann brauche ich diese Datei in einer bestimmten Datei für die beiden Seiten ... unter seinem dem Code:

app.js

window.$ = window.jQuery = require('jquery'); 
require('./bootstrap'); 

page.js

require('./app.js') 
require('jquery-ui/ui/widgets/slider'); 

Es scheint, dass es jetzt funktioniert, auch wenn ich jetzt eine js-Datei in alle Ansichten aufnehmen muss ... Frage, es ist noch offen, ich hoffe, dass jemand eine bessere Idee hat.

Answer 2

Ich denke, Sie sollten jquery-ui laden, wenn eine Bedingung erfüllt ist, wie:

if (window.loadJQueryUI) { 
    require('jquery-ui'); 
} 

Und brauchen Sie loadJQueryUI für die beiden Seiten zu initialisieren, wie folgt aus:

<script type="text/javascript"> 
    window.loadJQueryUI = true; 
</script>