Commons

Contents

• Commons

  • Default web engine

  • Creating a new project

Default web engine

All library components require engine parameter which must contain an object with class Eva (see API reference).

The arguments can be omitted if the default web engine object is set:

import { Eva } from "@eva-ics/webengine";
import { set_engine } from "@eva-ics/webengine-react";

const eva = new Eva();

set_engine(eva);

Creating a new project

Let us create a new web project with Vite:

npx --yes create-vite hmi1 --template react-ts
cd hmi
npm install
npm install --save @eva-ics/webengine-react

Modify main.tsx as the following:

eva.load_config().then(() => {
  ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
    // uncomment in production
    //<React.StrictMode>
      <HMIApp engine={eva} Dashboard={HmiDashboard} />
    //</React.StrictMode>
  );
});

where Dashboard is a React component, which appears after a user is successfully authenticated.

Create a file public/config.json (see Configuring), which contains at least HMI API URI:

{
  "engine": {
    "api_uri": "http://yourhost:port"
  }
}

See WebEngine Quick start and EVA ICS v4 Quick start about how to build and deploy the web application.