smart typescript fallback

Author: ajivanyandev

packages/devextreme-schematics/package.json

@@ -26,8 +26,7 @@
     "@angular-devkit/schematics": "^17.3.17",
     "@schematics/angular": "^17.3.17",
     "parse5": "^7.3.0",
-    "picomatch": "^4.0.3",
-    "typescript": "~5.2.1"
+    "picomatch": "^4.0.3"
   },
   "devDependencies": {
     "@types/jasmine": "~3.10.18",
@@ -36,6 +35,7 @@
     "@types/semver": "^7.7.1",
     "jasmine": "^2.99.0",
     "rxjs": "^6.6.7",
-    "tslint": "^5.20.1"
+    "tslint": "^5.20.1",
+    "typescript": "~5.2.1"
   }
 }

packages/devextreme-schematics/src/migrate-config-components/template-migrator.ts

@@ -1,16 +1,13 @@
 import { Tree } from '@angular-devkit/schematics';
 import * as parse5 from 'parse5';
 import picomatch from 'picomatch';
+import { resolveTypeScript } from '../utility/typescript-resolver';
 
 // Dynamically require TypeScript if available; skip inline template migration if not.
-let ts: any = null;
-let tsResolutionError: string | null = null;
-try {
-  // tslint:disable-next-line:no-var-requires
-  ts = require('typescript');
-} catch (err) {
-  tsResolutionError = err?.message || String(err);
-}
+// Uses a 3-level fallback: project search -> global search -> temporary install
+const tsResolution = resolveTypeScript();
+const ts: any = tsResolution.ts;
+const tsResolutionErrors: string[] = tsResolution.errors;
 
 // Minimal parse5 types for our usage
 interface P5Node { [k: string]: any; }
@@ -80,10 +77,18 @@ export async function applyInlineComponentTemplateMigrations(
     return;
   }
   if (!ts) {
+      const errorDetails = tsResolutionErrors.length
+        ? `Resolution attempts:\n${tsResolutionErrors.map(e => '  - ' + e).join('\n')}\n`
+        : '';
       exec.logger.warn(
         '[config-migrator] Failed to import TypeScript. Skipping inline template migration.\n' +
-        (tsResolutionError ? `Error: ${tsResolutionError}\n` : '') +
-        'Ensure the "typescript" package is installed in your project. Try to reinstall DevExtreme Schematics if the issue persists.'
+        errorDetails +
+        'The schematic attempted to find TypeScript using a 3-level fallback:\n' +
+        '  1. Project search (your project\'s node_modules)\n' +
+        '  2. Global search (global node_modules)\n' +
+        '  3. Temporary install (automatic download)\n\n' +
+        'To resolve this issue, install TypeScript in your project:\n' +
+        '  npm install typescript --save-dev\n\n'
       );
       return;
   }

packages/devextreme-schematics/src/utility/typescript-resolver.ts

@@ -0,0 +1,144 @@
+import { execSync } from 'child_process';
+import * as path from 'path';
+import * as fs from 'fs';
+
+export interface TypeScriptResolutionResult {
+  ts: any | null;
+  resolutionMethod: 'project' | 'global' | 'temporary' | null;
+  errors: string[];
+}
+
+/**
+ * Resolves TypeScript with a 3-level fallback strategy:
+ * 1. Project search - look in the user's project node_modules
+ * 2. Global search - look in global node_modules
+ * 3. Temporary install - use npx to temporarily install typescript
+ */
+export function resolveTypeScript(): TypeScriptResolutionResult {
+  const errors: string[] = [];
+
+  try {
+    const projectTs = tryResolveFromProject();
+    if (projectTs) {
+      return {
+        ts: projectTs,
+        resolutionMethod: 'project',
+        errors: []
+      };
+    }
+  } catch (err) {
+    errors.push(`Project resolution failed: ${err?.message || err}`);
+  }
+
+  try {
+    const globalTs = tryResolveFromGlobal();
+    if (globalTs) {
+      return {
+        ts: globalTs,
+        resolutionMethod: 'global',
+        errors: []
+      };
+    }
+  } catch (err) {
+    errors.push(`Global resolution failed: ${err?.message || err}`);
+  }
+
+  try {
+    const tempTs = tryResolveViaTemporaryInstall();
+    if (tempTs) {
+      return {
+        ts: tempTs,
+        resolutionMethod: 'temporary',
+        errors: []
+      };
+    }
+  } catch (err) {
+    errors.push(`Temporary install failed: ${err?.message || err}`);
+  }
+
+  return {
+    ts: null,
+    resolutionMethod: null,
+    errors
+  };
+}
+
+function tryResolveFromProject(): any {
+  const searchPaths = [
+    process.cwd(),
+    path.dirname(require.main?.filename || ''),
+  ];
+
+  for (const searchPath of searchPaths) {
+    try {
+      const tsPath = require.resolve('typescript', { paths: [searchPath] });
+      // tslint:disable-next-line:no-var-requires
+      return require(tsPath);
+    } catch {
+      // Continue to next path
+    }
+  }
+
+  return null;
+}
+
+function tryResolveFromGlobal(): any {
+  try {
+    const globalPath = execSync('npm root -g', { encoding: 'utf8' }).trim();
+    const typescriptPath = path.join(globalPath, 'typescript');
+
+    if (fs.existsSync(typescriptPath)) {
+      // tslint:disable-next-line:no-var-requires
+      return require(typescriptPath);
+    }
+  } catch {
+    // Fall through
+  }
+
+  return null;
+}
+
+function tryResolveViaTemporaryInstall(): any {
+  try {
+    const tmpDir = path.join(require('os').tmpdir(), 'devextreme-schematics-ts-' + Date.now());
+    fs.mkdirSync(tmpDir, { recursive: true });
+
+    const packageJson = {
+      name: 'temp-typescript-resolver',
+      version: '1.0.0',
+      dependencies: {
+        typescript: 'latest'
+      }
+    };
+    fs.writeFileSync(
+      path.join(tmpDir, 'package.json'),
+      JSON.stringify(packageJson, null, 2)
+    );
+
+    execSync('npm install --silent --no-progress', {
+      cwd: tmpDir,
+      stdio: 'ignore',
+      timeout: 30000
+    });
+
+    const typescriptPath = path.join(tmpDir, 'node_modules', 'typescript');
+    if (fs.existsSync(typescriptPath)) {
+      // tslint:disable-next-line:no-var-requires
+      const ts = require(typescriptPath);
+
+      setTimeout(() => {
+        try {
+          fs.rmSync(tmpDir, { recursive: true, force: true });
+        } catch {
+          // Ignore cleanup errors
+        }
+      }, 5000);
+
+      return ts;
+    }
+  } catch {
+    // Fall through
+  }
+
+  return null;
+}