Typescript cannot find modules that are already installed-CodePudding

I am trying to build a client that runs on Electron with Typescript, however, I am getting errors from the request.ts files.

The same thing happens on main.ts that I got from the Electron Typescript quickstart when it tries to import electron.

tsconfig.json is configured as follows:

{
  "compilerOptions": {
    "module": "ES2015",
    "noImplicitAny": true,
    "sourceMap": true,
    "outDir": "dist",
    "baseUrl": ".",
    "allowSyntheticDefaultImports": true,
    "types": [ "node" ],
    "paths": {
      "*": ["node_modules/*"]
    }
  },
  "include": [
    "src/**/*"
  ]
}

I made sure that baseUrl points to the directory node-modules is in so I'm sure the compiler can find node-modules.

And just to assure you that axios and electron are installed, here is package.json:

{
  "name": "electron-quick-start-typescript",
  "version": "1.0.0",
  "description": "A minimal Electron application written with Typescript",
  "scripts": {
    "build": "tsc",
    "watch": "tsc -w",
    "lint": "eslint -c .eslintrc --ext .ts ./src",
    "start": "npm run build && electron --no-sandbox ./dist/main.js"
  },
  "repository": "https://github.com/electron/electron-quick-start-typescript",
  "keywords": [
    "Electron",
    "quick",
    "start",
    "tutorial",
    "demo",
    "typescript"
  ],
  "author": "GitHub",
  "license": "CC0-1.0",
  "devDependencies": {
    "@types/axios": "^0.14.0",
    "@types/electron": "^1.6.10",
    "@types/jquery": "^3.5.14",
    "@types/node": "^17.0.42",
    "@typescript-eslint/eslint-plugin": "^4.33.0",
    "@typescript-eslint/parser": "^4.33.0",
    "electron": "^18.2.3",
    "eslint": "^7.32.0",
    "typescript": "^4.7.2"
  },
  "dependencies": {
    "axios": "^0.27.2",
    "jquery": "^3.6.0"
  }
}

When I specify module as commonjs I can get it running but I also get errors because tsc compiles import statements as require which isn't supported by browsers.

I tried using tspath but I couldn't run in it as I'm using Windows 11. I also tried giving relative paths but then I ended up with errors saying that "there were no declarations found" for those files. I would really appreciate any tips on how to solve this. Thanks in advance.

CodePudding user response：

The only way I can help you is by letting you see my tsconfig.json that I use in every project. Try to copy and paste it inside yours.

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "typeRoots": [
      "node_modules/@types",
      "src/types"
    ],
    "jsx": "react-jsx"
  },
  "include": [
    "src"
  ]
}