Is it possible to bundle and include npm/yarn packages in my server runtime code?

Has anyone gotten Webpack to work with Typescript for building the runtime index.js bundle?

I can only get it to output browser code, which the server can’t parse, or code which doesn’t seem complete. Setting Webpack’s "target": "node" option has no effect (still outputs browser code), and using "target": "es5" causes InitModule function not found. fatal error when the server tries to start.

Webpack is necessary since Typescript can’t natively bundle its code with node modules (like lodash). So you need to use Webpack to bundle it instead.

const path = require("path");

module.exports = {
    entry: "./src/main.ts",
    target: "es5",
    module: {
        rules: [
            {
                test: /\.ts$/,
                use: "ts-loader",
                exclude: /node_modules/,
            },
        ],
    },
    resolve: {
        extensions: ['.ts', '.js'],
    },
    output: {
        path: path.resolve(__dirname, "build"),
        filename: "index.js",
    },
};

@jasontosh We’ve not yet experimented with other bundlers instead of the builtin features of the TypeScript compiler to bundle the code. Can you open a feature request on the nakama-common repo and we’ll take a look at what it looks like to add support for a tool like Webpack.

I should also mention that the JS runtime in Nakama server is not the Node runtime so you should not expect to be able to resolve modules through Node-style imports. This is why we recommend the vanilla TypeScript toolchain to bundle your code.

Ok, I created an issue for it: [Feature] Example or template using Webpack as bundling tool for Typescript runtime code · Issue #571 · heroiclabs/nakama · GitHub

Webpack should be able to bundle all dependencies and eliminate the imports entirely. I think. People say it can. :sweat_smile: I’m still learning. I’ll keep banging on it.

2 Likes

:grinning: if JS runtime can use many third part JS/TS libs easily, that would be exciting

A while back, I got the package to build with Webpack (and Babel), but the server still fails to start, saying it can’t find the InitModule function (details in the GitHub issue).

Seems like if the server was more flexible about how that function can be defined/discovered, maybe it would work? But I’m only guessing and haven’t yet looked at what the server code tries to do at start up.

I’ve found that it is easier to use Rollup instead to bundle the code in a way that can be used in Nakama. I’ve set up a template https://github.com/tailam1990/nakama-rollup-ts, perhaps you can find something useful there for a webpack setup. I have yet to be able to setup webpack correctly without InitModule being wrapped in IIFEs or other problems.

1 Like

Cool! Thank you for sharing your solution. I’ll have a look at it. :+1:

I finally got time to try this, and it worked! :flushed: I am able to import and use lodash and other things. Only change I had to make was to set the build target in tsconfig.json to “es5”.

Thank you, @tailam1990 for providing your example! :raised_hands:

We’ve also extended our Server Framework TypeScript setup to show you how to use Rollup to bundle and include npm/yarn packages in your server runtime code TypeScript Setup - Heroic Labs Documentation