node.js - Αυτόματη μεταγλώττιση πακέτων TypeScript από άλλο χώρο εργασίας στο Turborepo
Έχω ένα monorepo βασισμένο σε Turborepo στο οποίο έχω μια κύρια εφαρμογή TypeScript (που ονομάζεται @myscope/tsapp) η οποία χρησιμοποιεί ένα άλλο πακέτο TypeScript στο ίδιο αποθετήριο (που ονομάζεται @myscope/tspackage). Μπορείτε να βρείτε το παράδειγμα αποθετηρίου που δημιούργησα για αυτή την ερώτηση εδώ: https://github.com/sigalor/typescript-transpile-workspace-packages
Το αρχείο apps/tsapp/src/index.ts φαίνεται έτσι:
import { sum } from "@myscope/tspackage";
console.log("The sum is:", sum(2, 3));
Και το αρχείο packages/tspackage/src/index.ts περιέχει απλώς τα εξής:
export function sum(a: number, b: number): number {
return a + b;
}
Τώρα η εκτέλεση του npm run dev στη ρίζα του αποθετηρίου έχει ως αποτέλεσμα το εξής:
> [email dev
> turbo run dev
• Packages in scope: @myscope/tsapp, @myscope/tsconfig, @myscope/tspackage
• Running dev in 3 packages
• Remote caching disabled
@myscope/tsapp:dev: cache bypass, force executing 0f1217618b24762f
@myscope/tsapp:dev:
@myscope/tsapp:dev: > @myscope/[email dev
@myscope/tsapp:dev: > tsc-watch --onSuccess "node ./dist"
@myscope/tsapp:dev:
@myscope/tsapp:dev:
@myscope/tsapp:dev: 12:32:26 - Starting compilation in watch mode...
@myscope/tsapp:dev:
@myscope/tsapp:dev:
@myscope/tsapp:dev: 12:32:27 - Found 0 errors. Watching for file changes.
@myscope/tsapp:dev: /home/cmd/typescript-transpile-workspace-packages/packages/tspackage/src/index.ts:1
@myscope/tsapp:dev: export function sum(a: number, b: number): number {
@myscope/tsapp:dev: ^^^^^^
@myscope/tsapp:dev:
@myscope/tsapp:dev: SyntaxError: Unexpected token 'export'
@myscope/tsapp:dev: at internalCompileFunction (node:internal/vm:73:18)
@myscope/tsapp:dev: at wrapSafe (node:internal/modules/cjs/loader:1176:20)
@myscope/tsapp:dev: at Module._compile (node:internal/modules/cjs/loader:1218:27)
@myscope/tsapp:dev: at Module._extensions..js (node:internal/modules/cjs/loader:1308:10)
@myscope/tsapp:dev: at Module.load (node:internal/modules/cjs/loader:1117:32)
@myscope/tsapp:dev: at Module._load (node:internal/modules/cjs/loader:958:12)
@myscope/tsapp:dev: at Module.require (node:internal/modules/cjs/loader:1141:19)
@myscope/tsapp:dev: at require (node:internal/modules/cjs/helpers:110:18)
@myscope/tsapp:dev: at Object.<anonymous> (/home/cmd/Downloads/typescript-transpile-workspace-packages/apps/tsapp/dist/index.js:3:19)
@myscope/tsapp:dev: at Module._compile (node:internal/modules/cjs/loader:1254:14)
@myscope/tsapp:dev:
@myscope/tsapp:dev: Node.js v18.16.0
Φυσικά κατανοώ γιατί συμβαίνει αυτό: Προφανώς το @myscope/tspackage δεν μεταγλωττίζεται από το tsc-watch, οπότε δεν μπορεί να εκτελεστεί. Αλλά πώς μπορώ να το διορθώσω;
Μέχρι τώρα το έκανα έτσι ώστε να μεταγλωττίζω το @myscope/tspackage εντελώς ξεχωριστά, δες το branch tspackage-transpiled στο αποθετήριο που συνδέεται παραπάνω. Αλλά μετά γίνεται πολύ βαρετό όταν κάνω αλλαγές στο @myscope/tspackage, γιατί πρέπει πρώτα να τερματίσω το tsc-watch από το @myscope/tsapp, να ξαναμεταγλωττίσω το @myscope/tspackage και μετά να ξεκινήσω ξανά το tsc-watch.
Παρατήρησα ότι το Next.js έχει την επιλογή transpilePackages η οποία είναι ακριβώς αυτό που θέλω, αλλά φυσικά μόνο για το σύμπαν Next.js/frontend: https://github.com/vercel/turbo/blob/main/examples/basic/apps/web/next.config.js
Υπάρχει μια επιλογή σαν αυτή και για το τυπικό TypeScript, ώστε το tsc (ή tsc-watch) που εκτελείται από μέσα στο @myscope/tsapp να μεταγλωττίζει επίσης αυτόματα το @myscope/tspackage;
Απάντηση #1
Προς το παρόν χρησιμοποιώ ένα σενάριο στο πακέτο μου που χρειάζεται μεταγλώττιση για να καλέσω το tsc κατά την ανάπτυξη.
// package.json
{
"main": "dist/index.js",
"scripts": {
"dev": "tsc --watch"
}
}
// tsconfig.json
{
"include": ["src"],
"compilerOptions": {
"preserveWatchOutput": true
}
}
Θα ήταν ωραίο να είναι διαθέσιμο σε turborepo
