Examples Don't Work

[redwolf-albath]

Hey,

I tried to use your project, it's very promising.

I ran into issued with typescript, tried many things to resolve it but it seems there is an issue with your project.

Here is the code:

import { BusUtil } from '@vmw/transport/util/bus.util';
import { LogLevel } from '@vmw/transport/log';

export class App {

    constructor() {
        // initializing transport, with debug logging enabled, and the boot message is not disabled.
        // BusUtil.bootBusWithOptions(LogLevel.Debug, false);
        BusUtil.bootBus()
    }
}

I'll share the error below, please let me know how I can fix it.

/home/[redacted]/Documents/repos/transport_tests/node_modules/@vmw/transport/util/bus.util.js:5
import { TransportEventBus } from '../bus';
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at Object.compileFunction (node:vm:353:18)
    at wrapSafe (node:internal/modules/cjs/loader:1039:15)
    at Module._compile (node:internal/modules/cjs/loader:1073:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1138:10)
    at Module.load (node:internal/modules/cjs/loader:989:32)
    at Function.Module._load (node:internal/modules/cjs/loader:829:14)
    at Module.require (node:internal/modules/cjs/loader:1013:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (/home/[redacted]/Documents/repos/transport_tests/dist/index.js:4:20)
    at Module._compile (node:internal/modules/cjs/loader:1109:14)
[redacted]@[redacted]:~/Documents/repos/transport_tests$ node -v

[jooskim]

Hello! Thanks for posting an issue. I am more than happy to help here!

First off, I assume you ran the sample code that you pasted into a TS or JS file, and the reason you're seeing that error message is because by default Node.js environment does not allow you to use import statement unless you change the extension of your file to .mjs, or set "type": "module" in your package.json. On the other hands, on the browser it won't complain as the modern browsers have been supporting ES6 syntax out of the box.

Now, having said that, chances are even after taking either approach above, you will still see an error saying the module was not found. This is because the Transport was built modular so depending on your build system (e.g. Webpack) you can benefit from tree shaking. However, this means the free-standing sample code as shown above cannot be used as-is where you import only the necessary pieces and leave the module wiring part incomplete. Instead, what you need is the UMD module which we also provide alongside TS counterparts. Check it out here

As for the correct instructions with the UMD module, you can refer to this section of the README, or check out the StackBlitz demo.

As an alternative, if you are using Angular as your front-end application framework (or React or any other frameworks), chances are the imports above and uses of them will work out of the box because Angular's Webpack handles all module resolving and bundling for you. So if you're using any of these frameworks, give it a try there.

Also, I acknowledge that the README is a bit unclear on the assumptions and prerequisites that I just described above, and we'll make sure to update the contents to be as clear as possible. Thanks and let me know if you have further problems!

[daveshanley]

We're working on our documentation updating things and adding ready to run examples that should work out of the box. Thank you for pointing this out and helping us get better.

[daveshanley]

We have updated our examples and documentation on getting up and running. We also added runnable examples via StackBlitz. Please check them out and let us know what you think.

Importing via ES6
Importing via UMD
Using in Angular
Using in React
Hello World
Connecting to a Broker