Make common and backend as esm

.github/workflows/CI.yml

@@ -34,12 +34,15 @@ jobs:
       - name: ESLint
         run: npm run lint
 
-      - name: Typecheck
-        run: npm run typecheck
-
       - name: Prettier
         run: npm run prettier
 
+      - name: Build app/common
+        run: npm run build --prefix ./app/common
+
+      - name: Typecheck
+        run: npm run typecheck
+
       - name: Build presentation-rules-editor-react package
         run: npm run build --prefix ./presentation-rules-editor-react
 

README.md

@@ -15,12 +15,16 @@ To start editing rulesets, you will need to build the editor application:
    npx pnpm install
    ```
 
-3. Build presentation-rules-editor-react (if it was never built prior):
+3. Build app/common and presentation-rules-editor-react (if it was never built prior):
 
    ```shell
    npm run build:components
    ```
 
+   ```shell
+   npm run build:common
+   ```
+
 4. Start the application:
 
    ```shell

app/backend/package.json

@@ -3,12 +3,14 @@
   "version": "0.0.1",
   "license": "MIT",
   "private": true,
+  "type": "module",
   "author": {
     "name": "Bentley Systems, Inc.",
     "url": "https://www.bentley.com"
   },
   "scripts": {
-    "start": "ts-node-dev --transpile-only --quiet -- src/main.ts",
+    "start": "tsx src/main.ts",
+    "build": "tsc",
     "lint": "eslint ./src/**/*.{ts,tsx}",
     "typecheck": "tsc --noEmit",
     "typecheck:watch": "tsc --noEmit --watch"
@@ -31,7 +33,7 @@
     "@types/node": "^20.17.6",
     "dotenv": "^16.4.5",
     "eslint": "^8.57.1",
-    "ts-node-dev": "^2.0.0",
+    "tsx": "4.19.2",
     "typescript": "^5.7.2"
   }
 }

app/backend/src/PresentationRulesEditorRpcImpl.ts

@@ -9,7 +9,7 @@ import * as os from "os";
 import * as path from "path";
 import { IModelMetadata, PresentationRulesEditorRpcInterface } from "@app/common";
 import { RpcManager } from "@itwin/core-common";
-import { SnapshotFileNameResolver } from "./SnapshotFileNameResolver";
+import { SnapshotFileNameResolver } from "./SnapshotFileNameResolver.js";
 
 /** The backend implementation of PresentationRulesEditorRpcInterface. */
 export class PresentationRulesEditorRpcImpl extends PresentationRulesEditorRpcInterface {

app/backend/src/main.ts

@@ -11,8 +11,8 @@ import { RpcConfiguration } from "@itwin/core-common";
 import { ECSchemaRpcImpl } from "@itwin/ecschema-rpcinterface-impl";
 import { BackendIModelsAccess } from "@itwin/imodels-access-backend";
 import { Presentation, PresentationBackendLoggerCategory, PresentationBackendNativeLoggerCategory } from "@itwin/presentation-backend";
-import { PresentationRulesEditorRpcImpl } from "./PresentationRulesEditorRpcImpl";
-import { initialize } from "./web/BackendServer";
+import { PresentationRulesEditorRpcImpl } from "./PresentationRulesEditorRpcImpl.js";
+import { initialize } from "./web/BackendServer.js";
 
 dotenv.config({ path: "../../.env" });
 

app/backend/tsconfig.json

@@ -1,8 +1,8 @@
 {
   "extends": "../../tsconfig.base.json",
   "compilerOptions": {
-    "module": "CommonJS",
-    "target": "ES2022"
+    "outDir": "lib",
+    "sourceMap": true
   },
   "include": ["src"]
 }

app/common/eslint.config.js → app/common/eslint.config.cjs

@@ -4,12 +4,15 @@
  *--------------------------------------------------------------------------------------------*/
 
 const iTwinPlugin = require("@itwin/eslint-plugin");
-const eslintBaseConfig = require("../../eslint.base.config");
+const eslintBaseConfig = require("../../eslint.base.config.js");
 
 module.exports = [
   {
     files: ["**/*.{ts,tsx}"],
     ...iTwinPlugin.configs.iTwinjsRecommendedConfig,
   },
+  {
+    ignores: ["lib/"],
+  },
   ...eslintBaseConfig,
 ];

app/common/index.ts

@@ -3,5 +3,5 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 
-export * from "./src/PresentationRulesEditorRpcInterface";
-export * from "./src/Rpcs";
+export * from "./src/PresentationRulesEditorRpcInterface.js";
+export * from "./src/Rpcs.js";

app/common/package.json

@@ -3,12 +3,20 @@
   "version": "0.0.1",
   "license": "MIT",
   "private": true,
+  "type": "module",
+  "exports": {
+    ".": {
+      "import": "./lib/index.js"
+    },
+    "./package.json": "./package.json"
+  },
   "author": {
     "name": "Bentley Systems, Inc.",
     "url": "https://www.bentley.com"
   },
   "scripts": {
-    "lint": "eslint **/*.{ts,tsx}"
+    "lint": "eslint **/*.{ts,tsx}",
+    "build": "tsc"
   },
   "dependencies": {
     "@itwin/core-bentley": "^4.10.2",

app/common/src/Rpcs.ts

@@ -6,7 +6,7 @@
 import { IModelReadRpcInterface, IModelTileRpcInterface, SnapshotIModelRpcInterface } from "@itwin/core-common";
 import { ECSchemaRpcInterface } from "@itwin/ecschema-rpcinterface-common";
 import { PresentationRpcInterface } from "@itwin/presentation-common";
-import { PresentationRulesEditorRpcInterface } from "./PresentationRulesEditorRpcInterface";
+import { PresentationRulesEditorRpcInterface } from "./PresentationRulesEditorRpcInterface.js";
 
 export const rpcInterfaces = [
   ECSchemaRpcInterface,

app/common/tsconfig.json

@@ -1,8 +1,9 @@
 {
   "extends": "../../tsconfig.base.json",
   "compilerOptions": {
-    "module": "CommonJS",
-    "target": "ES2022"
+    "outDir": "lib",
+    "sourceMap": true,
+    "declaration": true
   },
   "include": ["index.ts", "src"]
 }

app/e2e-tests/tsconfig.json

@@ -3,7 +3,6 @@
   "compilerOptions": {
     "lib": ["DOM"],
     "jsx": "react-jsx",
-    "moduleResolution": "NodeNext",
     "resolveJsonModule": true,
     "esModuleInterop": true,
     "sourceMap": true,

app/frontend/src/index.scss

@@ -12,25 +12,3 @@ body {
 iframe {
   border: 0;
 }
-
-// Expensive font goes first so that browser considers it last
-@font-face {
-  font-family: "Open Sans";
-  font-style: normal;
-  font-weight: 1 1000;
-  src:
-    local("Open Sans"),
-    url("/fonts/OpenSans-rest.woff2") format("woff2");
-  unicode-range: U+80-FFFF;
-}
-
-@font-face {
-  font-family: "Open Sans";
-  font-style: normal;
-  font-weight: 1 1000;
-  src:
-    local("Open Sans"),
-    url("/fonts/OpenSans-subset.woff2") format("woff2");
-  // Unprintable + latin + digits + punctuation, and © (for the footer)
-  unicode-range: U+00-7F, U+A9;
-}

app/frontend/tsconfig.json

@@ -3,7 +3,6 @@
   "compilerOptions": {
     "sourceMap": true,
     "isolatedModules": true,
-    "moduleResolution": "NodeNext",
     "lib": ["dom", "dom.iterable", "esnext"],
     "esModuleInterop": true,
     "jsx": "react-jsx",

package.json

@@ -4,7 +4,11 @@
     "start:qa": "cross-env IMJS_URL_PREFIX=qa- run-p --silent start:backend start:frontend",
     "start:web": "cross-env DEPLOYMENT_TYPE=web npm run start:frontend",
     "start:backend": "npm run start --prefix ./app/backend",
+    "build": "npm run build:common && npm run build:components && run-p build:backend build:frontend",
+    "build:backend": "npm run build --prefix ./app/backend",
     "build:components": "npm run build --prefix ./presentation-rules-editor-react",
+    "build:frontend": "npm run build --prefix ./app/frontend",
+    "build:common": "npm run build --prefix ./app/common",
     "start:frontend": "npm run start --prefix ./app/frontend -- --open",
     "link": "npm run link --prefix ./scripts --",
     "unlink": "npm run unlink --prefix ./scripts --",