Nakama Js Client With Cocos Creator 3.0

Local Setup
1

Cocos Creator 3.0preview1 removed support for Javascript as a scripting language , instead they are now supporting Typescript as the only scripting language used in The Engine editor .

How can i adapt and use the nakama-js client in this version of Cocos , i tried copying the dist folder that contains declaration files so i can use Nakama Typescript types , But i am always getting errors when i run the game (with and without the server running ).

This is the dist folder :

Cocos_Creator_-cocos-nakama-_Untitled_04January2021_29_525

i can do something like

var client : Client = new Client("defaultkey", "127.0.0.1", "7350",false);

Without getting any types errors but when i run the game , i get these error :

Uncaught (in promise) Error: Error loading http://localhost:7456/scripting/assets/nakama/index.js from http://localhost:7456/scripting/assets/scripts/Player.js (SystemJS Error#3 https://git.io/JvFET#3)
    at HTMLScriptElement.<anonymous> (script-load.js:69)
1 Like
2

I have fixed this by adding only nakama-js.umd.js to the assets folder and importing the script as plugin

image

1 Like
3

Thanks for the write up on the solution you achieved @MrZak-dev :+1:

@lugehorsam We should see what we can do to make the Type Definitions easier to consume with the new Cocos Creater 3.0 release. :thinking:

3 Likes
4

The solution i did is , i copied these files to my Cocos Creator 3.0 assets folder
assets/libs/nakama

image
only files with red .

Then i have renamed nakama-js.esm.js to nakama.js
and also renamed index.d.ts to nakama.d.ts

Now i am able to use Nakama Types (With type checking) in typescript

import {Client, Session, Socket} from '../libs/nakama/nakama';

async start () {
    var client = new Client("defaultkey", "127.0.0.1", "7350") 

    const email = "hello@example.com";
    const password = "somesupersecretpassword";

    var session = await client.authenticateEmail(email,password);
}

Note : for me this is a better solution then the one below

3 Likes
5

Thank you, @MrZak-dev. This post is really helpful! Follow your setting I found another solution: beside the dist folder there are *.ts files:

Screen Shot 2021-01-28 at 09.59.28
Just import them into assets/libs/nakama and use them directly:

import {Client} from "../libs/nakama/client";
import {Session} from "../libs/nakama/session";
2 Likes
6

You really made this solution better , Thanks to @Okno i was able to replace .d.ts files with the simple .ts files and it works .
You can use only these files without the need of a .js file

7

Thanks everyone for sharing their workarounds. We have 3.0 support on our radar including better typescript support for sure.