【发布时间】:2017-11-23 13:17:40
【问题描述】:
我正在使用 Laravel 在编译资产时遇到问题。默认情况下,laravel 为 webpack 提供了一个包装器,即laravel-mix、laravel-mix,使用名为webpack.mix.js 的文件,并使用npm run dev 命令laravel-mix将所有js 文件编译成一个webpack 包js 文件。
webpack.mix.js 的代码:
let mix = require('laravel-mix');
mix.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css');
我有一个 Main.js 文件,其中包含一些 jquery 代码。
Main.js:
;( function( $, window, document, undefined ) {
'use strict';
$(window).on('load', function() {
alert('ready');
});
}
)( jQuery, window, document );
我的目录结构是这样的
resources\assets\js
app.js
bootstrap.js
Main.js
app.js 代码:
require('./bootstrap');
bootstrap.js 代码:
try {
window.$ = window.jQuery = require('jquery');// jquery
require('bootstrap');// bootstrap framework js
require('./Main'); // Main.js
} catch (e) {
}
当我键入命令 npm run dev 时,所有资产都编译到一个文件中,那么为什么我的 Main.js jquery 代码(它只是一个警报弹出窗口)不会在页面上执行。
但是当我将bootstrap.js 文件的顺序更改为类似这样时,我的Main.js 代码将被执行。
try {
window.$ = window.jQuery = require('jquery');// jquery
require('./Main'); // Main.js
require('bootstrap');// bootstrap framework js
} catch (e) {
}
为什么会发生这种情况。 bootstrap framework js 文件和Main.js 文件之间是否发生冲突。
【问题讨论】:
-
您的代码不执行时能否提供浏览器控制台?
-
@nmfzone 没有出现任何错误,但是当我加载我的页面时,我的
Main.js脚本没有执行
标签: laravel laravel-mix