I am currently in the process of setting up a Next.js project with typescript. Despite following multiple guides, I have encountered an issue concerning import aliases.
It's unclear whether this problem stems from my configuration or from Next.js itself.
I have tried implementing suggestions from various sources that address similar issues, but unfortunately, none have provided a solution:
- https://github.com/zeit/next-plugins/issues/535
- https://medium.com/anna-coding/how-to-use-absolute-module-import-path-in-next-js-dcbc806272e5
One approach I attempted was tweaking Next.js' webpack configuration to resolve the issue (such as adding resolve.alias options directly to next.config.js), but this did not yield any positive results. It is worth mentioning that Next.js supposedly has built-in support for typescript now (resolve.extensions are well defined).
Next.js version 9.3.5
babel-plugin-module-resolver version 4.0.0
Included below are snippets from my tsconfig.json and .babelrc files for reference.
{
"compilerOptions": {
// compiler options here
},
// exclude and include paths here
}{
"presets": [ "next/babel" ],
"plugins": [
// module resolver plugin configuration here
]
}