I try to shorten my imports in typescript
from import {Hello} from "./components/Hello";
to import {Hello} from "Hello";
For that I found out you can use resolve.alias
in webpack thus I configured that part as following
resolve: {
root: path.resolve(__dirname),
alias: {
Hello: "src/components/Hello"
},
extensions: ["", ".ts", ".tsx", ".js"]
},
Webpack builds, and the output bundle.js works. However typescript's intellisense complain it cannot find the module
So my question is whether or not webpack's resolve.alias works with typescript?
I found following issue but there's no answer to it.
If you're using ts-loader
, you might have to synchronize your webpack alias
/resolve
settings with your paths
setting in your tsconfig.json
.
{
"compilerOptions": {
"baseUrl": "./",
"paths": {
"Hello": ["src/components/Hello"]
}
}
}
If you're using awesome-typescript-loader
, then webpack can figure this out automatically from the paths
setting in your tsconfig.json
, as per the status on this issue from the repo. That way, you don't need to duplicate the same information in your Webpack alias
field.