fix: resolve dynamic import aliases in template literals

Fixes #520

Previously, Webpack failed to resolve Nuxt aliases (e.g., `~`, `@`) within dynamic `import()` statements that used template literals (e.g., `~/components/${component}.vue`).

This commit introduces the use of Webpack's `NormalModuleReplacementPlugin` to intercept and correctly resolve these aliased paths before Webpack processes them, ensuring proper module resolution during the build process.

Author: Seu Nome

babel.config.js

@@ -11,6 +11,9 @@ module.exports = function (api) {
             node: 'current'
           }
         }]
+      ],
+      plugins: [
+        '@babel/plugin-transform-runtime'
       ]
     }
   }

packages/typescript-build/src/index.ts

@@ -5,7 +5,7 @@ import type { Module } from '@nuxt/types'
 import type { Options as TsLoaderOptions } from 'ts-loader'
 import type { ForkTsCheckerWebpackPluginOptions as TsCheckerOptions } from 'fork-ts-checker-webpack-plugin/lib/ForkTsCheckerWebpackPluginOptions'
 import type TsCheckerLogger from 'fork-ts-checker-webpack-plugin/lib/logger/Logger'
-import type { RuleSetUseItem } from 'webpack'
+import type { RuleSetUseItem, NormalModuleReplacementPlugin } from 'webpack'
 
 export interface Options {
   ignoreNotFoundWarnings?: boolean
@@ -53,23 +53,36 @@ const tsModule: Module<Options> = function (moduleOptions) {
     const jsxRuleLoaders = config.module!.rules.find(r => (r.test as RegExp).test('.jsx'))!.use as RuleSetUseItem[]
     const babelLoader = jsxRuleLoaders[jsxRuleLoaders.length - 1]
 
-    config.module!.rules.push(...(['ts', 'tsx'] as const).map(ext =>
-      ({
-        test: new RegExp(`\\.${ext}$`, 'i'),
+    config.module!.rules.push(...(['ts', 'tsx'] as const).map(ext =>      ({
+        test: new RegExp(`\\.${ext}$`),
         use: [
           babelLoader,
           {
             loader: 'ts-loader',
             options: {
               transpileOnly: true,
-              appendTsxSuffixTo: ext === 'tsx' ? [/\.vue$/] : [],
+              appendTsxSuffixTo: ext === 'tsx' ? [/.vue$/] : [],
               ...(options.loaders && options.loaders[ext])
             }
           }
         ]
       })
     ))
-
+    // Fix paths not resolving in async imports
+    // https://github.com/nuxt/typescript/issues/520
+    if (this.nuxt.options.alias) {
+      const { NormalModuleReplacementPlugin } = require('webpack')
+      const aliases = Object.keys(this.nuxt.options.alias)
+      config.plugins!.push(new NormalModuleReplacementPlugin(
+        new RegExp(aliases.join('|')),
+        (resource: any) => {
+          const alias = aliases.find(alias => resource.request.startsWith(alias))
+          if (alias) {
+            resource.request = resource.request.replace(alias, this.nuxt.options.alias[alias])
+          }
+        }
+      ))
+    }
     if (options.typeCheck && isClient && !isModern) {
       // eslint-disable-next-line @typescript-eslint/no-var-requires
       const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin')
@@ -95,4 +108,4 @@ const tsModule: Module<Options> = function (moduleOptions) {
   })
 }
 
-export default tsModule
+export default tsModule