demo app

[cervalx]

I am trying to build a simple initial app using Vite, I have first generated a scheleton: npm create vite@latest my-vue-app -- --template vanilla-ts Secondly I added the provided example code and in main.ts now I have:

import "./style.css";
import typescriptLogo from "./typescript.svg";
import viteLogo from "/vite.svg";
import { setupCounter } from "./counter.ts";
/* Example: Print all portfolio positions to console. */

import { IBApi, EventName, ErrorCode, Contract } from "@stoqey/ib";

// create IBApi object

const ib = new IBApi({
  // clientId: 0,
  // host: '127.0.0.1',
  port: 7497,
});

// register event handler

let positionsCount = 0;

ib.on(EventName.error, (err: Error, code: ErrorCode, reqId: number) => {
  console.error(`${err.message} - code: ${code} - reqId: ${reqId}`);
})
  .on(EventName.position, (account: string, contract: Contract, pos: number, avgCost?: number) => {
    console.log(`${account}: ${pos} x ${contract.symbol} @ ${avgCost}`);
    positionsCount++;
  })
  .once(EventName.positionEnd, () => {
    console.log(`Total: ${positionsCount} positions.`);
    ib.disconnect();
  });

// call API functions

ib.connect();
ib.reqPositions();

document.querySelector<HTMLDivElement>("#app")!.innerHTML = `
  <div>
    <a href="https://vitejs.dev" target="_blank">
      <img src="${viteLogo}" class="logo" alt="Vite logo" />
    </a>
    <a href="https://www.typescriptlang.org/" target="_blank">
      <img src="${typescriptLogo}" class="logo vanilla" alt="TypeScript logo" />
    </a>
    <h1>Vite + TypeScript</h1>
    <div class="card">
      <button id="counter" type="button"></button>
    </div>
    <p class="read-the-docs">
      Click on the Vite and TypeScript logos to learn more
    </p>
  </div>
`;

setupCounter(document.querySelector<HTMLButtonElement>("#counter")!);

The code builds successfully, with some warnings related to "... module externalized for browser compatibility" Unfortunately in the browser the page is not displayed and the console log throws the errors:

Uncaught ReferenceError: process is not defined
    at _dotenvKey (@stoqey_ib.js?v=12df7155:611:7)
    at Object.config (@stoqey_ib.js?v=12df7155:731:11)
    at node_modules/@stoqey/ib/dist/common/configuration.js (@stoqey_ib.js?v=12df7155:853:20)
    at __require (@stoqey_ib.js?v=12df7155:3:50)
    at node_modules/@stoqey/ib/dist/core/io/controller.js (@stoqey_ib.js?v=12df7155:7064:43)
    at __require (@stoqey_ib.js?v=12df7155:3:50)
    at node_modules/@stoqey/ib/dist/api/api.js (@stoqey_ib.js?v=12df7155:7311:24)
    at __require (@stoqey_ib.js?v=12df7155:3:50)
    at node_modules/@stoqey/ib/dist/index.js (@stoqey_ib.js?v=12df7155:22518:17)
    at __require (@stoqey_ib.js?v=12df7155:3:50)

I know that this is not a problem with the library itself but more of a problem with compatibility with Vite, nevertheless this would be a great start for a complete demo app using the example code.