TheRealPapa
TheRealPapa

Reputation: 4539

Webpack function import not accessible by JS on page

First time learning webpack with Laravel 5.5.

I have a helpers.js library which I include into my app.js bunlde like this:

import * as $mh from './helpers.js';

An example function in helpers.js is:

export function valRemoveHighlight(element)
{
    $(element).closest('.form-group, .input-group, .has-feedback').removeClass('has-error').addClass('has-success');
}

I can then access this function inside the bundle like this:

$mh.valRemoveHighlight(element);

But I have JS script at the bottom of my page which cannot access the function in the bundle. I have tried different scopes with no success:

window.$mh.valRemoveHighlight(element);
$mh.valRemoveHighlight(element);
valRemoveHighlight(element);

How do I make these exported / imported helper functions accessible in the global scope, so any inline / page script can access them?

Ideally kept within the helpers scope $mh. but accessible from the page / script like:

$mh.valRemoveHighlight(element);

Thanks!

Upvotes: 2

Views: 398

Answers (1)

Abderrahmane TAHRI JOUTI
Abderrahmane TAHRI JOUTI

Reputation: 4283

$mh is only available inside of app.js, so you will have to expose that function yourself inside your app.js by doing : window.$mh = $mh

Upvotes: 4

Related Questions