从html调用时未定义导入的Javascript函数_Javascript_Html_Laravel 5_Webpack_Vuejs2

从html调用时未定义导入的Javascript函数

javascript html laravel-5 webpack vuejs2

从html调用时未定义导入的Javascript函数,javascript,html,laravel-5,webpack,vuejs2,Javascript,Html,Laravel 5,Webpack,Vuejs2,我正在学习Laravel5.5和VueJs，我的问题是当我从一个js文件导出一些函数，然后从另一个js文件导入时，它不能从html主体调用。例如： A.js B.js 在这一点上，如果我在B.js中使用函数funA，它会工作，但是如果我在html页面上使用它，它会说funA没有定义。例如： <!DOCTYPE html> <html lang="en"> <body> <button onClick="funA()"></button&g

我正在学习Laravel5.5和VueJs，我的问题是当我从一个js文件导出一些函数，然后从另一个js文件导入时，它不能从html主体调用。例如：

A.js

B.js

在这一点上，如果我在B.js中使用函数

funA

，它会工作，但是如果我在html页面上使用它，它会说funA没有定义。例如：

<!DOCTYPE html>
<html lang="en">
<body>
  <button onClick="funA()"></button>
  <script src="{{asset('js/B.js')}}"></script>
</body>
</html>

任何帮助都将不胜感激。感谢您的高级支持。

我认为您的HTML希望

funA

位于全局

窗口对象上。新的JavaScript模块系统没有向全局名称空间添加任何内容，以避免名称空间污染
如果你只是想在按钮上使用is，那么做下面的操作应该可以让你工作
window.funA = funA

您可以在B.js
中执行此操作。不过，我不推荐这样做，因为我看到您似乎正在使用Vue，而且有更好的方法。让我知道这是否有效，还可以尝试共享您的Vue代码，以便有人可以帮助您以正确的方式进行操作。
谢谢您，这确实有效，我知道使用Vuejs
还有其他方法可以做到这一点，但是A.js
包含许多我在整个系统中使用的帮助函数，我需要它独立于VueJs。再次感谢。您可以尝试在根vue实例上设置函数。
<!DOCTYPE html>
<html lang="en">
<body>
  <button onClick="funA()"></button>
  <script src="{{asset('js/B.js')}}"></script>
</body>
</html>

mix.scripts('resources/assets/js/libs/materialize.js', 'public/js/libs/materialize.js')
    .js('resources/assets/js/A.js', 'public/js/js/A.js')
    .js('resources/assets/js/B.js', 'public/js/B.js');

window.funA = funA