Newbie lost at JS Client side import

I am learning that I am not aware of a lot of prerequisites before taking on this venture. However I hope that if I cannot get a direct answer perhaps someone may know where I should begin before this line…

To me the statement “import it into your project to use it” doesn’t mean anything, as I am not sure what the definition of ‘project’ is.

So I’ve attempted to troubleshoot what I’m missing on my own and attempted the following.

I began by using http-server (http-server - npm) and having everything I want in the index.html
importing it as source in the html does not work, as the browser doesn’t know how to interpret the @ symbol.

So I found an article about setting up a web server with node and express on the mozilla site. so I went back to writing the same way as in the guide with import from and when I run it with

node main.js
It says that ‘import’ cannot be used outside a module. Some help sites said to add in “type”: “module”, to the package.json but this hasn’t helped for me. So, similar to how they load Express I attempted to do the following syntax

const {Client} = require ("@heroiclabs/nakama-js");

There’s not initialization errors for this first line, however when adding anything beyond the first line of the guide there are errors reported during initialisation.
with just

var client = new nakamajs.Client("defaultkey", "127.0.0.1", "7350");

It says : “ReferenceError: nakamajs is not defined”

So I realize that I am missing quite a few basics that were meant to be understood beforehand, however I am not sure where to even begin to understand how to structure a ‘project’ as it is expected in here. If there are some prerequisites that I could be guided towards I would appreciate it.

This is to do with your JS build system. How are you downloading the NakamaJS dependency and how are you bundling up your JS application?

I agree, this documentation is completely opaque to me.
With hours of research I found one way that works: installing @heroiclabs/nakama-js with npm in the folder of my index.html, then using

const nakamajs = require("@heroiclabs/nakama-js");

in main.js, then browserifying main.js to bundle.js and src-ing this in index.html instead of main.js.

I was supposing it’s what’s implied by the “The client is available on NPM. After installing the client import it into your project.” part.
But now it seems I was wrong because I tried to do the same with the deviceInfo part, and browserify won’t work on require(‘react-native-device-info’).
Says:

Error: Parsing file /path/to/html/node_modules/react-native/index.js: ‘import’ and ‘export’ may appear only with ‘sourceType: module’ (14:0)

So now I’m completely in the dark again…

It’s a shame because installing the nakama server, locally, then in a droplet, adding a leaderboard, then using it in a unity client, all that went flawlessly. But simply using the JS client, about 8 hours in, I still have no idea.

I haven’t had much time to work on this more.

It is as was suggested and the ‘build’ of my system is where my knowledge is lacking.

I like jquentin installed via npm

Last I was working on this, I finally got an understanding that we are likely meant to setup a webserver to be able to include the const {Client} = require ("@heroiclabs/nakama-js"); in the pages served.

I’ve tried using Express’ application generator (found here : Express application generator )

then modify the app.js to include the client server reference by following their third party middleware inclusion. (here: Using Express middleware )

I finally got it to accept the syntaxes inclusion, but then there were additional errors. Not sure if I’m on the right path here.