如何在Laravel webpack.mix.js中添加全局函数？

Question

我正在使用Laravel mix来编译我的资产，并将它们组合成单个文件。我创建了一个新的js文件，并在其中编写了一些方法。我将此文件与app.js文件合并。当我尝试调用这些方法时，从刀片文件中收到错误function not defined。我无法访问这些方法。

请帮助我调用这些方法。

Laravel混合代码

mix.js([ 'js/app.js',
         'js/custom.js'
        ], 'public/js'),
.....

Custom.js

function test(){
  alert('test')
}

test.blade.php

<script type="text/javascript" src="app.js"></script>
<script type="text/javascript">
    test();
</script>

  

错误：未定义测试

Answer 1

只需将其分配给窗口即可。所以在您的Custom.js中

window.test = function(){
  alert('test')
}

并在您的test.blade.php中使用它：

<script type="text/javascript">
    window.test();
</script>

Answer 2

不只是将新文件连接到app.js的末尾，更干净的方法（imho）就是保持webpack.mix.js不变。

在custom.js中创建resources/assets/js文件，只需在require('./custom');底部添加resources/assets/js/app.js

然后将其作为其余构建过程的一部分。

Answer 3

尝试一下：

custom.js

function test(){
    alert('test')
}

export { test };

app.js

...
import { test } from './custom.js';