I have a JavaScript file called 'test.js' and in that file is this code snippet;

function functionTest() {
    console.log('this works');
}

I then import test.js into the head of my HTML inside a blade.php with;

<script type="module" src="/js/test.js"></script>

Finally, in the script tag in the body portion of my HTML, I call functionTest with

<script>
    functionTest()
</script>

However I never get a console.log. Instead, this error is thrown from my HTML;

Uncaught ReferenceError: functionTest is not defined<

I have a JavaScript file called 'test.js' and in that file is this code snippet;

function functionTest() {
    console.log('this works');
}

I then import test.js into the head of my HTML inside a blade.php with;

<script type="module" src="/js/test.js"></script>

Finally, in the script tag in the body portion of my HTML, I call functionTest with

<script>
    functionTest()
</script>

However I never get a console.log. Instead, this error is thrown from my HTML;

Uncaught ReferenceError: functionTest is not defined<

• javascript
• html
• function
• laravel-blade

2 Answers 2

Your <script> tag is importing the JS file as a module.

As such it must be treated as a module, e.g., you need to export something, and import it to use it in your main file.

If you just want to use it as-is, without module-ish work, remove the type="module" from the <script> tag.

Export your function:

const functionTest = () => {
    console.log('this works')
};

export default functionTest;

Then you can import it as module.