Búsqueda de sitios web

javascript - Visual Studio 2019 no compilará TypeScript con webpack-source


Mi problema parece que Visual Studio está intentando importar módulos que no debería. Este es el error que estoy recibiendo. Estoy intentando configurar webpack con Visual Studio. La compilación de webpack funciona bien. La compilación de TypeScript en Visual Studio falla.

Severity    Code    Description Project File    Line    Suppression State
Error   TS2792  Build:Cannot find module '.'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option? Nester.MvcUI    C:\...\MvcUI\node_modules\@types\webpack-sources\lib\CachedSource.d.ts  3   
Error   TS2792  Build:Cannot find module '.'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option? Nester.MvcUI    C:\...\MvcUI\node_modules\@types\webpack-sources\lib\CompatSource.d.ts  1   
Error   TS2792  Build:Cannot find module '.'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option? MvcUI   C:\...\MvcUI\node_modules\@types\webpack-sources\lib\ConcatSource.d.ts  4   
Error   TS2792  Build:Cannot find module '.'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option? MvcUI   C:\...\MvcUI\node_modules\@types\webpack-sources\lib\OriginalSource.d.ts    4   
Error   TS2792  Build:Cannot find module '.'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option? MvcUI   C:\...\MvcUI\node_modules\@types\webpack-sources\lib\PrefixSource.d.ts  1   
Error   TS2792  Build:Cannot find module '.'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option? MvcUI   C:\...\MvcUI\node_modules\@types\webpack-sources\lib\RawSource.d.ts 1   
Error   TS2792  Build:Cannot find module '.'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option? MvcUI   C:\...\MvcUI\node_modules\@types\webpack-sources\lib\ReplaceSource.d.ts 1   
Error   TS2792  Build:Cannot find module '.'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option? MvcUI   C:\...\MvcUI\node_modules\@types\webpack-sources\lib\Source.d.ts    4   
Error   TS2792  Build:Cannot find module '.'. Did you mean to set the 'moduleResolution' option to 'node', or to add aliases to the 'paths' option? MvcUI   C:\...\MvcUI\node_modules\@types\webpack-sources\lib\SourceMapSource.d.ts   3   

Todas las líneas de código son una importación de '.'

import { SourceLike } from '.';

Encontré este hilo pero esta solución no funcionó. VS Code muestra que el módulo no se encuentra aunque la compilación de WebPack funcione. Incluso se generan más errores si lo cambio.

este es mi tsconfig.json

{
  "compilerOptions": {
    "noImplicitAny": true,
    "noEmitOnError": true,
    "removeComments": false,
    "sourceMap": true,
    "target": "ES6",
    "module": "ES6",
    "jsx": "react",
    "allowJs": true,
    "outDir": "./tsdist/",
    "moduleResolution": "Classic"
  },
  "include": [
    "./TSApp/**/*"
  ],
  "exclude": [ "wwwroot", "node_modules" ]
}

Este es mi webpack.config.js

"use strict";
const { join } = require('path');
const { VueLoaderPlugin } = require('vue-loader');
const { HotModuleReplacementPlugin } = require('webpack');
const HTMLWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const path = require('path')

module.exports = {
    entry: "./TSApp/file.ts",
    devtool: 'inline-source-map',
    output: {
        path: path.resolve("wwwroot/js"),
        filename: "site.js"
    },
    resolve: {
        alias: {
            vue: 'vue/dist/vue.esm-browser.js'
        },
        extensions: [ '.tsx', '.ts', '.js' ]
    },
    devServer: {
        contentBase: ".",
        host: "localhost",
        port: 9999
    },
    module: {
        rules: [
            {
                test: /\.ts$/,
                use: "ts-loader"
            },
            {
                test: /\.vue$/,
                loader: "vue-loader"
            },
            {
                test: /\.(scss|css)$/,
                use: ["vue-style-loader", "css-loader", "sass-loader"]
            },
            {
                test: /\.s(c|a)ss$/,
                use: [
                    'vue-style-loader',
                    'css-loader',
                    {
                        loader: 'sass-loader',
                        // Requires sass-loader@^7.0.0
                        options: {
                            implementation: require('sass'),
                            indentedSyntax: true // optional
                        },
                        // Requires sass-loader@^8.0.0
                        options: {
                            implementation: require('sass'),
                            sassOptions: {
                                indentedSyntax: true // optional
                            },
                        },
                    },
                ],
            }
        ]
    },
    //loaders: [
    //    {
    //        test: /\.jsx?$/,
    //        loader: "babel-loader"
    //    }
    //],
    plugins: [
        //new CleanWebpackPlugin(),
        //new HtmlWebpackPlugin({
        //    template: "./src/index.html"
        //}),
        new VueLoaderPlugin(),
        new MiniCssExtractPlugin({
            filename: "css/[name].css"
        })
    ]
};

Artículos relacionados