How do I use functios defined in imported scripts? Newbie question

Is there a handy part in the tutorials or manuals to explain this? I have imported functions from files into my project. They define various Javascript functions. I include an import statement in main.js for each of them. There is is a function called loadVerses(); But when I run my tiny project it says:

Unhandled error: loadVerses is not defined.

My function in the script file starts off like

function loadVerses() {

globalThis.sVerses = [ { At my event sheet I have System->On Start of Layout -> loadVerses() What am I missing>

You need to export the function so events can access it. In your script, change the line to: export function loadVerses()…

Even when I include the word export in front of the function it still doesn't work/

Event sheet 1, event 1, action 1: ReferenceError: loadVerses is not defined is the error I get

In main I put:

import { loadVerses } from "./selectedVerses.js";

In the file selectedVerses.js I have:

export function loadVerses() {

globalThis.sVerses = [ ... I am missing something else. I hope to get over these hurdles so i can just tell the thing what I want it to do.

I also tried import * as myModule from "./selectedVerses.js"

I tried a statement at the end export { loadVerses }. Doesn't work and can't see how to make these large files of code with an object integrate with my proposed game.

I hope someone can help.

Even when I have import { myTestVar } from "./testScript.js";

and testScript.js is:

export let myTestVar = '2';

the event code STILL doesn't know what myTestVar is when I try to console.log it.

Use either globalThis or modules (with import/export) - don't try to mix and match both.

It's difficult to help without seeing the full project - try sharing your project file to get better help.

I can't see how to upload a file here.

Normally there is a file attach button in forum software. Not sure how I should share my project file. Now I need to go to sleep as I live in Australia.

After the tutorial went so well and the documentation seemed so clear I expected to have a smoother run but a lot of basic things don't seem to be working. If someone like me can fail to do the basics maybe a few more explanations would be helpful.

For example, is there one project somewhere which actually uses an import/export script scenario? Modules and all?

Since I can't find any way to share the project, I am uploading the 3 small images which define all I did in this tiny project.

You can upload files to free services like Google Drive, OneDrive or Dropbox.

myVar is still undefined in the script block in the event sheet. You need to use an Imports for events script file to import things you want to use in event sheets. See Scripts in event sheets in the manual.

This is a clue towards solving the puzzle. Understanding what to do is still not clear because there is no example.

"Instead you can import things in to a script file with the purpose Imports for events, normally named importsForEvents.js. For example if you add the following line in the Imports for events script:

// importsForEvents.js

import * as Utils from "./utilities.js";

...then all your code in script actions and script blocks can use the exports in Utils, e.g. Utils.myExport(). This provides a useful way to write a library of functions that can be used by code anywhere else in the project, and is another good way to closely integrate event sheets with your JavaScript code."

How do you "import things into a script file with the purpose Imports for events"?

Is there a c3p file with an example of how this should all be done. In the parts of the manual I read, you put your import statements in main.js. But now there is this new file importsForEvents.js which is loaded when? And how? And then can its functions and variables be used anywhere?

All I want is to write functions and have essentially global variable objects I can use anywhere in events.

When I set the purpose of script.js to "Import for Events" and run the code I still get errors:

5bootPreview.js:55 Unexpected message type 'undefined'

OnBootMessage bootPreview.js:55

bootPreview.js:92 Registered service worker on preview.construct.net

4bootPreview.js:55 Unexpected message type 'undefined'

OnBootMessage bootPreview.js:55

previewWindow.js:28 [C3 preview] Browser opened wrong size popup: wanted 854 x 480, got 854 x 415; resizing to compensate

main.js:4 Uncaught SyntaxError: The requested module './script.js' does not provide an export named 'default'

I have no idea why I need an export named 'default'. Is this in the manual somewhere?

Can you please supply an example of a project which uses an external script file with a function to add 2 numbers which can be called by an event? As well as a variable that can be accessed globally?

Sometimes the simplest things are hard to know how to achieve to the novice who isn't familiar with all the rules around how things actually run and are executed.

Lately I've been working with external scripts, and you are not alone in your confusion!

Here's a link to a simple project: we.tl/t-FWO09cvUWq

It takes two numbers supplied as parameters and adds them together. It mixes event sheets with JS. Hopefully this helps.

There are already lots of examples built in to Construct in the Example Browser. Check the scripting category. For example the Guess the number example uses imports for events.

The message about using default exports is probably because your import/export syntax is wrong. Some forms of import require the thing being imported to have a default export, and if it doesn't, it won't work. If you don't export a default thing, then you need to use the import { NamedThing } from "./script.js";. This kind of thing will be covered by JavaScript language tutorials, which I strongly recommend you follow if you are not already familiar with JavaScript, as it will save you a lot of pain and confusion like this. In fact our own Learn JavaScript in Construct guide has a section that covers modules in brief - take a look at that.