Question

我在编译资产时使用laravel-mix面临问题。默认情况下，laravel使用名为laravel-mix的文件提供webpack的包装器webpack.mix.js，npm run dev，并使用laravel-mix命令，js编译所有{{1}将文件放入一个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文件之间是否发生冲突。

Answer 1

在评论中回复tldr：

<块引用>

没有出现任何错误，但是当我加载我的页面时，我的 Main.js 脚本没有执行

我遇到了同样的问题，包括 manifest.js 和 vendor.js 解决了这些问题：

<script src="{{ mix('js/manifest.js') }}"></script>
<script src="{{ mix('js/vendor.js') }}"></script>

Laravel Mix我的javascript代码没有运行

1 个答案: