Búsqueda de sitios web

javascript - Los alias de Webpack funcionan, pero Typescript me da error


El problema

Tengo un proyecto que utiliza comprobación de tipos para componentes de React (React-Typescript)

Hasta ahora, he configurado todo y está funcionando, excepto los alias en Typescript.

En webpack, el objeto module.alias te permite buscar carpetas específicas para la resolución de módulos de webpack

const path = require('path');
const HTMLWebpackPlugin = require("html-webpack-plugin");

module.exports = {
    mode: "development",
    entry: "./src/ts/app.tsx",
    plugins: [
        new HTMLWebpackPlugin({
            title: 'Pedro Uzcátegui',
            template: "./dist/index.html"
        }),
    ],
    output: {
        path: path.resolve(__dirname,"dist"), 
        filename: "bundle.js",
        publicPath: "/"
    },
    module: {
        rules: [
            {
                test: /\.(js|jsx)$/,
                exclude: /(node_modules|bower_components)/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-env','@babel/preset-react'] // ES5+ -> Old .Js | Tells babel we are using react
                    }
                }
            },
            {
                test: /\.(s[ac]ss|css)$/i,
                use: ['style-loader','css-loader','sass-loader']
            },
            {
                test: /\.tsx$/,
                exclude: /  node_modules/,
                loader: "ts-loader"
            },
            {
                test: /\.(png|svg|jpg|jpeg|gif)$/i,
                type: 'asset/resource',
            },
            {
                test: /\.(woff|woff2|eot|ttf|otf)$/i,
                type: 'asset/resource',
            },
        ]
    },
    resolve: {
        extensions: ['.ts','.js','.tsx','.jsx','.json'], // Importante, busca archivos por estos nombres al resolver modulos.
        modules: ['node_modules',path.resolve(__dirname,'src/ts/')],
        alias: {
            Components: 'Components/',
            Utils: 'Components/Utils/',
            Types: path.resolve(__dirname, 'custom.d.ts'),
            Styles: path.resolve(__dirname,"src/sass"),
            Assets: path.resolve(__dirname,'src/assets/')
        },
    },
    devtool: "inline-source-map",
    devServer: {
        contentBase: path.join(__dirname,'dist'), // Serve files from this directory
        compress: true,
        port: 3000
    },
}

Entonces, la cosa es que está funcionando bien, reconoce los componentes y se construye sin ningún error.

Pero en VSC....

Cannot find module 'Components/Menu/Menu' or its corresponding type declarations.

Este es mi archivo tsconfig.json

{
  "compilerOptions": {
    "target": "es6",                         
    "module": "commonjs",                   
    "jsx": "react",                            
    "sourceMap": true,                    
    "outDir": "server/js/",
    "strict": true,          
    "noImplicitAny": true,                 
    "moduleResolution": "node",        
    "baseUrl": "src/",                     
    "paths": {
      "Components": ["ts/Components"],
      "Utils": ["ts/Components/Utils/"],
      "Types":["ts/custom.d.ts"],
      "Styles":["sass/"],
      "Assets":["assets/"]
    },                                     
    "allowSyntheticDefaultImports": true, 
    "esModuleInterop": true,      
  "include": [
    "server/ts/*",
    "src/ts/**/*",
    "src/ts/custom.d.ts"
  ],
  "exclude": [
    "node_modules",
  ]
}

Y Mi Estructura de Carpetas

NOTA: El proyecto no se está bloqueando, va bien, pero parece que Typescript no puede encontrar el módulo.

¿Tal vez esto esté relacionado con la resolución de módulos de TypeScript o con algo que no estoy considerando?