How to keep namespaces in typescript using webpack?

@samara 

To keep namespaces in TypeScript when using webpack, you can follow these steps:

1. Define your namespaces in your TypeScript files using the namespace keyword. For example:

1
2
3
4
5

namespace MyNamespace {
    export function myFunction() {
        // function implementation
    }
}

1. Make sure that your TypeScript files have the proper reference to other files that are part of the same namespace. You can do this by using ///
2. Configure your webpack configuration file to handle TypeScript files. Make sure that the ts-loader is included as part of your webpack configuration.
3. Update your webpack configuration to preserve namespaces by setting the module option in the ts-loader configuration to es2015 and adding the preserveConstEnums option. For example:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

module: {
    rules: [
        {
            test: /.tsx?$/,
            use: 'ts-loader',
            exclude: /node_modules/,
            options: {
                compilerOptions: {
                    module: 'es2015',
                    preserveConstEnums: true
                }
            }
        }
    ]
}

1. Compile your TypeScript files using webpack by running webpack or webpack-dev-server in your terminal.

By following these steps, you should be able to keep namespaces in TypeScript when using webpack.