Configure TypeScript project references
Improvements:
- The common/ project is automatically built by dependent projects
- Building common/ in in the "prepare" script is thus no longer necessary
- Vite and server hot-reloading now work if files in common/ change
- Recompiling common after every change is done automatically
- Using "go to definition" now jumps to the .ts file rather than the .d.ts
Changes:
- Use TypeScript project references to refer to common/ from client/ and server/
- Set "composite" and "declarationMap" options in common/tsconfig.json
- See https://www.typescriptlang.org/docs/handbook/project-references.html
- Use tsc --build in order to build references automatically
- Replace nodemon and ts-node with ts-watch in server in order to use the new tsc --build mode
- See https://github.com/TypeStrong/ts-node/issues/897#issuecomment-647035509
- Remove now unneeded SIGUSR2 signal handler which was for nodemon
- Use tsc-watch before Vite in client in order for hot-reloading to work if common/ changes
- Update TypeScript version
- Add vite.config.node.json to be consistent with expected Vite project defaults
GitLab: #151
Change-Id: Id2f84fe45e44c4d8b4e6d3b324e1aee322c52df6
diff --git a/client/package.json b/client/package.json
index e8e26f0..3620108 100644
--- a/client/package.json
+++ b/client/package.json
@@ -4,10 +4,10 @@
"private": true,
"type": "module",
"scripts": {
- "start": "vite",
+ "start": "tsc-watch --build ../common --onSuccess \"vite\"",
"start:prod": "vite preview",
- "build": "tsc && vite build",
- "clean": "rm -rf dist",
+ "build": "tsc --build && vite build",
+ "clean": "rm -rf dist *.tsbuildinfo",
"test": "jest src",
"test:cypress": "cypress open",
"lint": "eslint .",
@@ -48,7 +48,6 @@
"filesize": "^10.0.5",
"framer-motion": "^7.3.5",
"i18next": "^21.9.2",
- "jami-web-common": "file:../common",
"mime": "^3.0.0",
"qrcode.react": "^3.1.0",
"react": "^18.2.0",
@@ -64,6 +63,7 @@
},
"devDependencies": {
"@types/jest": "^28.1.8",
+ "@types/node": "^18.11.9",
"@types/react": "^18.0.17",
"@types/react-dom": "^18.0.6",
"@types/react-modal": "^3.13.1",
@@ -73,8 +73,9 @@
"eslint-plugin-react-hooks": "^4.6.0",
"i18next-parser": "^6.5.0",
"sass": "^1.54.5",
- "typescript": "^4.7.4",
- "vite": "^3.1.8",
+ "tsc-watch": "^5.0.3",
+ "typescript": "~4.8.4",
+ "vite": "^3.2.3",
"vite-plugin-svgr": "^2.2.2"
}
}
diff --git a/client/tsconfig.json b/client/tsconfig.json
index c37e9c4..caf3b26 100644
--- a/client/tsconfig.json
+++ b/client/tsconfig.json
@@ -17,5 +17,6 @@
"strict": true,
"skipLibCheck": true
},
- "include": ["src"]
+ "include": ["src"],
+ "references": [{ "path": "./tsconfig.node.json" }, { "path": "../common" }]
}
diff --git a/client/tsconfig.node.json b/client/tsconfig.node.json
new file mode 100644
index 0000000..fcce3f9
--- /dev/null
+++ b/client/tsconfig.node.json
@@ -0,0 +1,10 @@
+{
+ "compilerOptions": {
+ "composite": true,
+ "module": "esnext",
+ "moduleResolution": "node",
+ "allowSyntheticDefaultImports": true,
+ "skipLibCheck": true
+ },
+ "include": ["vite.config.ts"]
+}
diff --git a/client/vite.config.ts b/client/vite.config.ts
index 55090d8..6a79d31 100644
--- a/client/vite.config.ts
+++ b/client/vite.config.ts
@@ -17,9 +17,10 @@
*/
import react from '@vitejs/plugin-react';
import { defineConfig } from 'vite';
-import svgrPlugin from 'vite-plugin-svgr';
+import svgr from 'vite-plugin-svgr';
export default defineConfig({
+ plugins: [react(), svgr()],
server: {
host: '0.0.0.0',
port: 3000,
@@ -30,5 +31,4 @@
define: {
global: {},
},
- plugins: [react(), svgrPlugin()],
});