Typescript can't understand declared d.ts file - Field 'browser' doesn't contain a valid alias configuration

I have Angular 9 application. I am using beta Webpack 5 which provides module federation feature. Just trying to play with this new tools.

I have standalone store application, which is served on localhost:9006 with module federation, it provides external remote bundle and shell(Angular 9) application can use it as imported bundle in runtime.

for example

import('s1').then( m => {

});

However the path

s1

is not part of angular, i declared it as module to tell typescript do not throw any error

declare module 's1'

It's path is src and filename is decl.d.ts

but when i start my application, I get error:

ERROR in ./src/app/app.component.ts 78:8-20
Module not found: Error: Can't resolve 's1' in '/home/alecoder/Projects/JS/adj_integration/packages/shell/src/app'
resolve 's1' in '/home/alecoder/Projects/JS/adj_integration/packages/shell/src/app'
  Parsed request is a module
  using description file: /home/alecoder/Projects/JS/adj_integration/packages/shell/package.json (relative path: ./src/app)
    Field 'browser' doesn't contain a valid alias configuration
    resolve as module
      /home/alecoder/Projects/JS/adj_integration/packages/shell/src/app/node_modules doesn't exist or is not a directory
      /home/alecoder/Projects/JS/adj_integration/packages/shell/src/node_modules doesn't exist or is not a directory
      looking for modules in /home/alecoder/Projects/JS/adj_integration/packages/shell/node_modules
        single file module
          using description file: /home/alecoder/Projects/JS/adj_integration/packages/shell/package.json (relative path: ./node_modules/s1)
            no extension
              Field 'browser' doesn't contain a valid alias configuration
              /home/alecoder/Projects/JS/adj_integration/packages/shell/node_modules/s1 doesn't exist
            .ts
              Field 'browser' doesn't contain a valid alias configuration
              /home/alecoder/Projects/JS/adj_integration/packages/shell/node_modules/s1.ts doesn't exist
            .js
              Field 'browser' doesn't contain a valid alias configuration
              /home/alecoder/Projects/JS/adj_integration/packages/shell/node_modules/s1.js doesn't exist
        /home/alecoder/Projects/JS/adj_integration/packages/shell/node_modules/s1 doesn't exist
      /home/alecoder/Projects/JS/adj_integration/packages/node_modules doesn't exist or is not a directory
      /home/alecoder/Projects/JS/adj_integration/node_modules doesn't exist or is not a directory
      /home/alecoder/Projects/JS/node_modules doesn't exist or is not a directory
      /home/alecoder/Projects/node_modules doesn't exist or is not a directory
      /home/alecoder/node_modules doesn't exist or is not a directory
      /home/node_modules doesn't exist or is not a directory
      /node_modules doesn't exist or is not a directory
 @ ./src/app/app.module.ts 16:0-47 63:22-34 80:16-28 87:24-36
 @ ./src/main.ts 5:0-45 9:41-50

Here is my webpack configuration

const AotPlugin = require("@ngtools/webpack").AngularCompilerPlugin;
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { resolve } = require('path');
const ProgressPlugin = require('webpack/lib/ProgressPlugin');
const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
const ModuleFederationPlugin = require('webpack/lib/container/ModuleFederationPlugin');

module.exports = {

  devtool: 'eval-cheap-source-map',
  mode: "development",
  entry: ["./src/polyfills.ts", "./src/main.ts"],
  node: false,

  output: {
    path: resolve('./dist'),
    publicPath: '/',
    filename: '[name].bundle.js',
    chunkFilename: '[id].chunk.js'
  },

  devServer: {
    https: true,
    host: 'dev.adjarabet.com',
    port: 443,
    historyApiFallback: true,
    disableHostCheck: true,
    watchOptions: {
      ignored: /node_modules/
    },
    inline: true,
    open: true,
    hot: true,
    //quiet: true
    //stats: 'minimal'
    stats: {
      colors: true,
      chunks: false,
      hash: true,
      version: true,
      timings: true,
      assets: false,
      children: false,
      source: true,
      warnings: true,
      noInfo: true,
      contentBase: './dist',
      hot: true,
      modules: false,
      errors: true,
      reasons: true,
      errorDetails: true,
    },  
  },

  resolve: {
    extensions: ['.ts', '.js'],
    plugins: [new TsconfigPathsPlugin(
      { 
        configFile: "./src/tsconfig.app.json"
      })
    ]
  },

  performance: {
    hints: false,
  },

  module: {
    rules: [
      {
        test: /\.ts$/,
        use: ['ts-loader', 'angular2-template-loader'],
        exclude: /node_modules/,
        // {loader: 'ts-loader', options: {configFile: 'tsconfig.webpack.json'}  },
      }, 

      {
        test: /\.html$/,
        use: 'html-loader'
      }, 

      {
        test: /\.scss$/,
        use: ['to-string-loader', 'css-loader', 'sass-loader']
      },  

      {
        test: /\.(eot|svg|cur|ico)$/,
        loader: 'file-loader',
        options: {
          name: `[name].[ext]`,
          limit: 10000
        }
      },

      // {
      //   test: /\.(jpg|png|webp|gif|otf|ttf|woff|woff2|ani|ico)$/,
      //   loader: 'url-loader',
      //   options: {
      //     name: `[name].[ext]`,
      //     limit: 10000
      //   }
      // },

      // {
      //   test: /[\/\\]@angular[\/\\]core[\/\\].+\.js$/,
      //   parser: { system: true },
      // }
    ]
  },


  plugins: [

    new ModuleFederationPlugin({
      name: 'shell_app',
      library: { type: 'var', name: 'shell_app' },
      filename: 'remoteEntry.js',
      remotes: {
        s1: 's1'
      },
      exposes: {
      },
      shared: []
    }),    
    new HtmlWebpackPlugin({
      template: "./src/index.html"
    }),
    // new AotPlugin({
    //   mainPath: resolve('./src/main.ts'),
    //   sourceMap: true,
    //   nameLazyFiles: true,
    //   tsConfigPath: resolve('./src/tsconfig.app.json'),
    //   skipCodeGeneration: true
    // }),
    // new CircularDependencyPlugin(),
    new ProgressPlugin({
      activeModules: false,
    }),
  ]
};

Here is my tsconfig.app.json configuration

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "../dist",
    // "types": ["node"]
  },
  "exclude": [
    "src/test.ts",
    "**/*.spec.ts",
    "node_modules"
  ],
  "angularCompilerOptions": {
    "enableIvy": false
  }  
}

and tsconfig.json that extends tsconfig.app.json

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@services/*": ["./app/services/*", "./app/modules/form/services/*"],
      "@typings/*": ["./app/typings/*"],
      "@app/*": ["./app/*"],
      "@env/*": ["./environments/*"]
    },
    "target": "es5",
    "module": "esnext",
    "declaration": false,
    "downlevelIteration": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "allowJs": true,
    "lib": ["es2018", "dom"],
    "mapRoot": "./maps",
    "moduleResolution": "node",
    "outDir": "./dist",
    "sourceMap": true,
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true,
  },
  "files": [
    "./decl.d.ts"
  ], 
}

It seems typescript can't see that module and tries to find it out under node_modules. I missed something in configuration but can't see where.