gr3g gr3g - 1 month ago 30
TypeScript Question

Webpack ts-loader : change tsconfig filename

I have 2 tsconfigs, one for my dev build and one for my prod build.

I choose the tsconfig with the

-p
flag :

tsc -p dev.tsconfig.json


Ts-loader is looking for a tsconfig.json file. How can I specify another filename with the ts-loader?

module.exports = {
entry : __dirname + "/src/app/main.ts",
output : {
path : __dirname + "/dist",
filename : "bundle.js"
},
resolve : {
extensions : ["", ".webpack.js", ".web.js", ".js", ".ts"]
},
module: {
loaders: [
{ test: /\.ts?$/, loader: "ts" }
]
}
};

Answer

Webpack enables us to add custom options for each loader. All ts-loader configuration properties are described here.

configFileName is the property you are looking for. It should be like this.

module.exports = {
    entry : __dirname + "/src/app/main.ts",
    output : {
        path : __dirname + "/dist",
        filename : "bundle.js"
    },
   resolve : {
     extensions : ["", ".webpack.js", ".web.js", ".js", ".ts"]
   },
   module: {
        loaders: [
            { test: /\.ts?$/, loader: "ts" }
        ]
    },
    ts: {
        configFileName : 'dev.tsconfig.json'
    }
};