未定义 Symfony 4 Javascript 函数

Question

我已经创建了一个 app.js(和 app.scss)来与 Symfony Encore 一起使用。

└───assets
    ├───css
    │   └───app.scss
    └───js
        └───app.js

应用程序.js:

/**
 * Name: app.js
 * Desc: Main application javascript
 */

var $ = require('jquery');
require('bootstrap-sass');
require('../css/app.scss');

// Initialize tooltips
$(function () {
  $('[data-toggle="tooltip"]').tooltip()
});

var openLoginModal = function(element){
    $('#login-modal').modal('show');
}

在我的一个模板中，我希望能够设置“onclick”事件以调用 app.js 中定义的“openLoginModal”函数

<a class="btn btn-info navbar-btn navbar-right" data-toggle="login-modal" onclick="openLoginModal(this)">Login</a>

单击 anchor 元素时，控制台中会显示以下错误:

Uncaught ReferenceError: openLoginModal is not defined
    at HTMLAnchorElement.onclick ((index):29)

我假设由于某种原因我无法访问 app.js 中的函数，但我对 webpack 的了解还不够，无法理解这是为什么

Answer 1

试试这个

(function ($, window)
{
   window.openLoginModal = function(element){
       $('#login-modal').modal('show');
   }
}(jQuery, window);