Joh*_*Doe 6 laravel laravel-mix
我Laravel在编译资产时遇到问题。laravel-mix默认情况下,laravel 提供了一个 webpack 的包装器,它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');
Run Code Online (Sandbox Code Playgroud)
我有一个Main.js包含一些jquery代码的文件。
主要.js:
;( function( $, window, document, undefined ) {
'use strict';
$(window).on('load', function() {
alert('ready');
});
}
)( jQuery, window, document );
Run Code Online (Sandbox Code Playgroud)
我的目录结构是这样的
resources\assets\js
app.js
bootstrap.js
Main.js
Run Code Online (Sandbox Code Playgroud)
app.js代码:
require('./bootstrap');
Run Code Online (Sandbox Code Playgroud)
bootstrap.js代码:
try {
window.$ = window.jQuery = require('jquery');// jquery
require('bootstrap');// bootstrap framework js
require('./Main'); // Main.js
} catch (e) {
}
Run Code Online (Sandbox Code Playgroud)
当我输入命令时,npm run dev所有资源都会编译到一个文件中,那么为什么我的Main.jsjquery 代码(只是一个警报弹出窗口)不会在页面上执行。
但是当我将bootstrap.js文件的顺序更改为类似的内容时,我的Main.js代码就会执行。
try {
window.$ = window.jQuery = require('jquery');// jquery
require('./Main'); // Main.js
require('bootstrap');// bootstrap framework js
} catch (e) {
}
Run Code Online (Sandbox Code Playgroud)
为什么会发生这样的事情。bootstrap framework js文件与文件之间是否发生冲突Main.js。
回复评论中的tldr:
没有出现任何错误,但是当我加载页面时,我的 Main.js 脚本没有执行
我遇到了同样的问题,包括manifest.js并vendor.js解决了这些问题:
<script src="{{ mix('js/manifest.js') }}"></script>
<script src="{{ mix('js/vendor.js') }}"></script>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
2578 次 |
| 最近记录: |