heroiclabs / nakama-docs

Documentation for Nakama social and realtime server.
https://heroiclabs.com/docs
Apache License 2.0
43 stars 68 forks source link

Rollup: CommonJS plugin throws SyntaxError: Unexpected token #224

Closed minosvasilias closed 3 years ago

minosvasilias commented 3 years ago

I'm trying to get rollup working with my typescript setup since i'd like to use a node module (jsonwebtokens) for a custom authentication system. I followed the instructions in the docs, but when i run npm run build, i get the following error:

./src/main.ts → index.js...
[!] (plugin commonjs) SyntaxError: Unexpected token (1:14) in PROJECT_PATH\src\main.ts
src\main.ts (1:14)
1: let InitModule: nkruntime.InitModule = function (
                 ^
2:   ctx: nkruntime.Context,
3:   logger: nkruntime.Logger,
SyntaxError: Unexpected token (1:14) in PROJECT_PATH\src\main.ts

Presumably it expects JS, but is getting TS. Looking at rollup.config.ts, the plugins are ordered as described in the docs:

import resolve from "@rollup/plugin-node-resolve";
import commonJS from "@rollup/plugin-commonjs";
import json from "@rollup/plugin-json";
import babel from "@rollup/plugin-babel";
import typescript from "@rollup/plugin-typescript";
import pkg from "./package.json";

const  extensions  = [".mjs",  ".js",  ".ts",  ".json"];

export  default  {
    input:  "./src/main.ts",
    external: ["nakama-runtime"],
    plugins: [
        // Allows node_modules resolution
        resolve({  extensions  }),
        // Compile TypeScript
        typescript(),
        json(),
        // Resolve CommonJS modules
        commonJS({  extensions  }),
        // Transpile to ES5
        babel({
            extensions,
            babelHelpers:  "bundled",
        }),
    ],
    output:  {
        file:  pkg.main,
    },
};

So typescript compilation should be happening before we get to commonJS. My tsconfig.json looks exactly like the one described in the docs as well. I'm at a bit of a loss, perhaps i am misunderstanding something about the process here. I tried setting include: "**/*.js" as an option for commonJS, which does skip the commonJS error, but then just moves to Babel complaining about the same thing. As you'd expect i suppose. Am i right in thinking that the issue lies with the rollup typescript plugin not doing its job here? How could i get this working? Any help would be appreciated!

Also, while the error is the same as in #214 , for me it appears specifically at the commonJS step, not the resolve step, and my project path seems to not be the issue.

tomglenn commented 3 years ago

Hi @minosvasilias.

Can you ensure the correct include path is set in tsconfig.json.

From the looks of it you should have it set to "src/**/*" and not "**/*.js".

minosvasilias commented 3 years ago

Hey @tomglenn, thanks. However my tsconfig include is set to "src/**/*" as you say.

Complete tsconfig.json:

{
    "compilerOptions": {
        "noImplicitReturns": true,
        "moduleResolution": "node",
        "esModuleInterop": true,
        "noUnusedLocals": true,
        "removeComments": true,
        "target": "es6",
        "module": "ESNext",
        "strict": false
    },
    "files": ["./node_modules/nakama-runtime/index.d.ts"],
    "include": ["src/**/*"],
    "exclude": ["node_modules", "build"]
}

package.json:

{
    "name": "PROJECT_NAME",
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
        "test": "echo \"Error: no test specified\" && exit 1",
        "build": "rollup -c",
        "type-check": "tsc --noEmit"
    },
    "repository": {
        "type": "git",
        "url": "git+REPO_URL"
    },
    "keywords": [],
    "author": "",
    "license": "ISC",
    "bugs": {
        "url": "REPO_URL/issues"
    },
    "homepage": "REPO_URL#readme",
    "devDependencies": {
        "@babel/core": "^7.15.5",
        "@babel/plugin-external-helpers": "^7.14.5",
        "@babel/preset-env": "^7.15.4",
        "@rollup/plugin-babel": "^5.3.0",
        "@rollup/plugin-commonjs": "^20.0.0",
        "@rollup/plugin-json": "^4.1.0",
        "@rollup/plugin-node-resolve": "^13.0.4",
        "@rollup/plugin-typescript": "^8.2.5",
        "rollup": "^2.56.3",
        "tslib": "^2.3.1",
        "typescript": "^4.3.2"
    },
    "dependencies": {
        "nakama-runtime": "git+https://github.com/heroiclabs/nakama-common.git"
    }
}

rollup.config.ts: as posted in the opening post

tomglenn commented 3 years ago

@minosvasilias Thanks for that. The configuration files look correct. I've created a fresh and bare-bones TypeScript project repository, could you take a look and compare your existing project in terms of structure and content of the main.ts file.

https://github.com/tomglenn/nakama-typescript-project

minosvasilias commented 3 years ago

@tomglenn Thank you, very helpful.

First off, just running your project worked without problems.

Comparing with my own i did not notice any relevant differences apart from multiple other .ts files in my src folder. As a sanity check however i just overwrote mysrc folder with the one from your project, which resulted in a successful npm run build. I then one-by-one re-added my other .ts scripts as well as reverted to the contents of my original main.ts and... it still worked.

So it took me a bit to notice, but it seems like the kicker was my Main.ts file not being lowercase. Renaming main.ts to Main.ts will immediately result in the same error again. And looking at the original error i posted, the commonjs plugin was also looking for a main.ts file.

Sadly, while it is compiling now, i'm facing another problem as it only appears to be compiling the contents of main.ts, not any of the other files. For simple reproduction, i tried adding the following file to src in your repo:

test.js

const TEST_CONSTANT = "TEST";

function testRPC(
    context: nkruntime.Context,
    logger: nkruntime.Logger,
    nk: nkruntime.Nakama,
    payload: string
): string {
    logger.info("Test print.");
    return TEST_CONSTANT;
}

and modified main.ts:

let InitModule: nkruntime.InitModule = function (ctx, logger, nk, initializer) {
    logger.info("TypeScript module loaded.");
    initializer.registerRpc("test_rpc", testRPC);
};

!InitModule && InitModule.bind(null);

Yet the generated index.js looks like this:

var InitModule = function InitModule(ctx, logger, nk, initializer) {
  logger.info("TypeScript module loaded.");
  initializer.registerRpc("test_rpc", testRPC);
};

!InitModule && InitModule.bind(null);

Edit: I suppose i just need to specify export and import declarations now, while with the standard configuration all files were compiled and bundled together by default. That works for me. In any case, since the Unexpected token error is resolved, i guess this can be closed. :)

tomglenn commented 3 years ago

@minosvasilias Yes as you mentioned, you'll need to use export and import statements. Rollup will discard unused code and since you weren't importing your testRPC function the contents of test.js will have been discarded.

Glad you got this issue resolved. I'll admit I would have never considered filename case sensitivity to be an issue! :)

minosvasilias commented 3 years ago

Yeah, it took me a while, too. :) Thanks for the help, appreciate it!