convert namespace to module based typescript code

Question

c# programmer here. I started work on a medium sized ts code base. Modelled off an existing c# codebase. I started out doing

namespace Foo
{
    export function x;
    export const y;
    export class C1{}
}

for things that map to static classes and functions in c# and and 'real' classes

Foo being in one file called Foo.js. To call things I just said Foo.x() in a different file.

All fine, but more reading leads me to 'dont use namespaces'. So time for a refactor

I just want to make sure that I am doing the correct conversion. So now I do

export class Foo
{
    public x(){};
    public static readonly  y;
    public class C1{}
}

That replacement for const seems a mouthful. And when I call things I have to go

import {Foo} from "./Foo";
Foo.x();

So is this correct? Optimal?

Note - I want to keep the calling code doing Foo.x(); var c = Bar.wibble; etc. Ie really separate out the namespace of different functional parts

casieber · Accepted Answer · 2018-05-22 18:49:26Z

4

Good news, you are making the conversion even harder on yourself than it needs to be. Instead of what you have written, try going for:

export function x() { /* ... */ }
export const y = /* ... */;
export class C1 { /* ... */ }

Then in your consuming files you can import only what you need:

import { x } from './Foo';
x();

Or if you want to continue to use it like a namespace you can:

import * as Foo from './Foo';
Foo.x();

In many cases you may be able to simply remove the wrapping namespace declaration and be done.

edited May 22, 2018 at 18:49

answered May 22, 2018 at 1:37

casieber

7,6122 gold badges23 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Estus Flask Over a year ago

import * as Foo from './Foo' to really use it as a namespace.

pm100 Over a year ago

i want to keep doing Foo.x not x in the calling code.

casieber Over a year ago

Updated answer to add in * as Foo syntax as well

pm100 Over a year ago

this doesnt work well - so it seems. If I have 2 files both with function x in them they end up clashing

casieber Over a year ago

The only way there could be clashing is if you did import { x } from './foo'; import { x } from './bar'. You can always either import using * as format: import * as Foo from './foo'; import * as Bar from './bar', or you can alias the imports import { x as fooX } from './foo'; import { x as barX } from './bar'

Collectives™ on Stack Overflow

convert namespace to module based typescript code

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related