typescript cannot find webpack alias module

[dreamerblue]

• Version: 2.7.4

I have cloned a new quick-start project and followed this link to install TS add-ons. https://webpack.electron.build/add-ons#typescript

Then in src/main/index.ts, I imported some module in src/main (alias as @) and src/common (alias as common).

Now eletcron-webpack dev runs with no error. But my IDE (such as VS Code) shows errors in editor:

Cannot find module '@/someModule'. ts(2307)
Cannot find module 'common/someModule'. ts(2307)

[mikerogne]

Just ran into this issue myself. Anyone able to find any follow-up info?

[dreamerblue]

@livemeta Thanks for your exploration, but it only works for Sass, not TypeScript.

Forgot to reply. Actually I found the solution a few times after posting the issue. Just add these below (the path to @ and common should be replaced by yours) to tsconfig.json, so that TypeScript can resolve these paths.

Tested on TypeScript 3.6.3 and 3.7.2.

"paths": {
  "@/*": ["src/main/*"],
  "common/*": ["src/common/*"]
}

[Caldis]

Also encountered this problem too, the solution from @dreamerblue solution is quite effective.

The key thing here is keep the "*" at the end of all keys and values

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["app/*"]
    }
}

[biziosan]

I have the same problem. I have tried the solutions posted here without success.

The application seems to run correctly. However, I noticed that also electron-webpack (2.8.2 and ewts 4.0.1) is complaining about not finding the module only the firs time it starts. Any additional reload doesn't make the message to reappear:

package.json: `

"electronWebpack": { "commonSourceDirectory": "src/common", "staticSourceDirectory": "src/static", "title": true, "main": { "sourceDirectory": "src/main", "webpackConfig": "src/main/webpack.additional.js"
}, "renderer": { "sourceDirectory": "src/renderer", "webpackConfig": "src/renderer/webpack.additional.js" } }, `

webpack.additional.js: module.exports = { resolve: { alias: { "@com": path.resolve(__dirname, '../common') } } }; tsconfig.json: `

"extends": "./node_modules/electron-webpack/tsconfig-base.json", "baseUrl": ".", "paths": { "@com/": ["src/common/"] }, `

Webstorm complains about this (SystemInformation is in the common directory): `

import { SystemInformation } from '@com/system_information'; `

electron-webpack complains about it too: `

┏ Main -----------------------

ERROR in D:/Projects/sd/teapot/src/renderer/app/app.component.ts(7,35): TS2307: Cannot find module '@com/system_information' or its corresponding type declarations.

┗ ---------------------------- ┏ Renderer -------------------

ERROR in D:/Projects/sd/teapot/src/renderer/app/app.component.ts(7,35): TS2307: Cannot find module '@com/system_information' or its corresponding type declarations.

┗ ----------------------------

`