I'm trying to configure a monorepo with a back (or "api") folder that uses Deno and a front (or "webapp") folder that is a react app (or actually, any framework, configured with Vite).

So the project actually mixes Deno and Node (if it's a bad idea, you can stop me right now). I'm might also consider using the Deno Linter and Formatter for the whole project.

The file structure would look something like that:

my-monorepo/
├── .vscode/
│   └── settings.json
├── back/
│   └── index.ts
├── front/
│   ├── src/
│   │   └── index.tsx
│   ├── index.html
│   └── vite.config.ts
├── .gitignore
├── deno.jsonc
└── package.json

It pretty much works but the main issue I encounters right now is with the VSCode Deno Extension.

Would it be possible to use the built-in VSCode JS and TS language services for the front/ folder and the Deno Language Server (deno lsp) for the back/ folder? Otherwise TS gets mad (for instance the imports in back/ must include .ts but in font they most no include .ts).

Finally, if I can make it work, I would like it to be easy for anyone who clones the repo to work with it.

Alo, here is the .vscode/settings.json file for the reference:

{
  "deno.enable": true,
  "deno.config": "./deno.jsonc",

  "[typescript]": {
    "editor.defaultFormatter": "denoland.vscode-deno",
  }
}

CodePudding user response：

You are going to run into issues with this setup. See these related GitHub issues 1, 2.

Instead, use Deno's LSP in one workspace (your backend) and the vanilla TS LSP in the other workspace (your frontend), using exclusive VS Code settings files in each. (If you do repo top-level scripting with Deno, then it's fine to duplicate that VS Code config for the top-level, too.)

Then, open a separate VS Code window for each workspace in your monorepo so that they can use their own LSPs without conflict.