Goal:

I'm trying to move ts/tsx files and update imports afterwards.
Then turn that into a vscode extension.

Result:

Using ts-morph I was able to do so for ts files but it can't seem to detect tsx files.

Is goal possible?

Is it possible to make ts-morph detect tsx files or do I have to use something else?
If so please recommend your best choice.

Code

These are the parts relevant to detecting source files.
I've made the project using.

const getTsconfigPath = (uri: vscode.Uri) => {
  const workspaceFolder = vscode.workspace.getWorkspaceFolder(uri);
  const invalid = !workspaceFolder;
  if (invalid) {
    vscode.window.showErrorMessage("No workspace folder found.");
    return;
  }

  const tsconfigPath = path.join(workspaceFolder.uri.fsPath, "tsconfig.json");
  const noFile = !fs.existsSync(tsconfigPath);
  if (noFile) {
    vscode.window.showErrorMessage("tsconfig.json not found in project root.");
    return;
  }
  return tsconfigPath;
};

export const makeProject = (uri: vscode.Uri) => {
  // Load tsconfig.json (closest to project root)
  const tsconfigPath = getTsconfigPath(uri);
  if (tsconfigPath === undefined) return;

  const project = new Project({ 
    tsConfigFilePath: tsconfigPath,
  });
  return project;
}

And the tsconfig.json is

{
  "compilerOptions": {
    "baseUrl": ".",
    "target": "ES2020",       
    "module": "commonjs",
    "lib": ["ES2020"],
    "moduleResolution": "node",
    "esModuleInterop": true,
    "outDir": "out",
    "rootDir": "src",
    "strict": true,
    "sourceMap": true,
    "inlineSources": true,
    "jsx": "react-jsx",
    "allowJs": true
  },
  "include": ["./src"]
}

#How To Refactor tsx code?

Goal:

Result:

Is goal possible?

Code