JavaScript - join js files using tsc

In this short article we would like to show how to join pure JavaScript files into single js file with tsc command.

Note: you can read this article too, to see how to compile *.ts file int single js file.

Simple steps:

1. prepare configuration for TypeScript compiler that will join our *.js files togather

There are avaialble two modules that let join files togather amd or system - in the below example we use amd one.

tsconfig.json file example:

xxxxxxxxxx

{

    "version": "4.0.3",

    "compilerOptions": {

        "strict": true,

        "target": "es5",

        "module": "amd",  /* <----------------------- requred  */

        "composite": true,

        "declaration": true,

        "allowJs": true,  /* <----------------------- requred  */

        "sourceMap": true,  /* <--------------------- only for easier development  */

        "rootDir": "resources/",

        "outFile": "resources/merged.js"  /* <------- requred  */

    },

    "files": [

        "resources/lib/js/jquery/jquery.min.js",

        "resources/lib/js/sweetalert2/sweetalert2.js",

        "resources/lib/js/leaflet/leaflet.js",

        "resources/js/common.js",

        "resources/js/popper.js"

    ]

}

​

Where:

• files property contains list of all files that should be joined - should be served in order we want keep.

2. run compiler

It is necessary to run tsc command from same directory, where is located tsconfig.json file.

Command example:

xxxxxxxxxx

tsc

or

xxxxxxxxxx

tsc -p path/to/tsconfig.json

Note: as result we should see src/main/webapp/resources/merged.js file with combined js files.