1
他のファイル(all.js)のJSパッケージからメソッドを呼び出すことができないようです。私はLaravel 5.4、VueJS2、VueRouterを使用しています。これは、Laravelがバックエンドとして機能するSPAです。コンパイル済みjsファイルの呼び出しメソッド
私は次のエラーを取得する：TypeError: $.LoadingOverlay is not a function
私は、Webパックを利用して、このような資産をコンパイルしています：
mix.js([
'resources/assets/js/bootstrap.js',
'resources/assets/js/helpers.js',
'././node_modules/gasparesganga-jquery-loading-overlay/src/loadingoverlay.min.js',
'resources/assets/js/app.js',
'././node_modules/moment/min/moment.min.js',
'././node_modules/moment-duration-format/lib/moment-duration-format.js',
], 'public/js/all.js').version();
私はプルしようとしているコードを含むファイルがloadingoverlay.min.jsファイルです。それを参照しているファイルは、すぐ下にあります(app.js)。
マイapp.jsファイル：
import Vue from 'vue';
import VueRouter from 'vue-router';
var $ = require('jquery');
Vue.use(VueRouter);
const routes = [
.. routes here
];
const router = new VueRouter({
routes,
mode: 'history',
});
router.beforeEach((to, from, next) => {
console.log('Entering route');
$.LoadingOverlay('show');
next();
});
router.afterEach((to, from) => {
console.log('Entered route');
$.LoadingOverlay('hide');
})
const app = new Vue({
router
}).$mount('#app');
コンパイルされた資産に引っ張っする責任があるブレード・ファイル：
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="author" content="">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<link rel="stylesheet" href="{{ mix('css/all.css') }}">
<meta name="csrf-token" content="{{ csrf_token() }}"/>
</head>
<body>
<div id="app">
<section class="container">
<div>
<router-view></router-view>
</div>
</section>
</div>
<script src="{{ mix('js/all.js') }}"></script>
</body>
</html>
を興味深いことに、私はそのファイルからメソッドを呼び出すことができています私のブレードページから、all.jsファイルが引き込まれた後に<script></script>タグを追加してそこから呼び出すことによって、
これはなぜ起こっているのでしょうか？
複数のバージョンのjQueryの使用を中止してください。 – Adam