Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

184
Vistas
How to make namespaces and external modules live together in typescript old projects

Hy everyone,

I'm struggling trying to find a way to solve the following problem:

  1. I have a web application composed by some plain js obtained from old typescript projects
  2. The old typescript projects uses namespaces and transpiles to plain javascript.
  3. I need to extend an old library, coming from one of the projects, with a new part that uses import/export in order to consume some external libraries.
  4. I need also to compile the new part (that extend the old one) in a way that I can use in projects written in old style.

I have tried by creating a new project where

  • I have a file "a.ts" where I'm doing all the imports that I need and export a class

     /// <reference path="../MyOldLib.d.ts" />
     import * as AAA from 'ExternalComponentINeed';
     export class XXX extends I.J.K.W{
       constructor() {
         super();
         ...
       }
       ...
     }
    

where I.J.K is the namespace as in the old library and W is a base class that i need to extend

  • I have file "b.ts" that import the "a.ts" as:

     import * as A_ from "./A";
     declare global {
       namespace I.J.K {
         export import A = A_;
       }
     }
    
  • In the end I have the last file c.ts that declares the namespace

     namespace I.J.K {
       // Force `I.J.K` to be created at runtime.
       (() => {})();
     }
    

I'using webpack to build all together with this config file:

    const path = require('path');
    module.exports = {
      entry:  ['./src/c.ts','./src/b.ts'],
      module: {
      rules: [
       {
          test: /\.tsx?$/,
          exclude: [/node_modules/],
          use: 'ts-loader',
       },
      ],
    },
    resolve: {
      extensions: ['.tsx', '.ts', '.js'],
    },
    node: {global: true},
    output: {
      library: 'mylibrary',
      libraryTarget: 'umd',
      filename: 'mylibrary.js',
      libraryExport: 'default',
      auxiliaryComment: 'Test Comment',
      path: path.resolve(__dirname, 'dist'),
    },
   };

Doing this way I can manage to generate a d.ts file that I can use in the old project, everything compile but in the browser does not work and emits the following:

    Uncaught TypeError: Cannot read properties of undefined (reading 'A')

and here is the point where the code breaks:

    class c extends I.J.K.W  --> I is not defined

We know that it isn't a good way to go but we need a patch. We are planning to refactor our libraries but we can't stop developing and also we would like to have a way to refactor the libraries a little at a time

Any help would be greatly appreciated. Thanks

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda