What's the difference between tsconfig's 'outFile' and webpack config's 'output'
Asked Answered
U

1

6

What's different between the 'output' path? Is tsconfig is a loader? And webpack to resolve '.ts' file after the run tsconfig build?
Why the file 'src.js' is not found? It is deleted by webpack automatically?

tsconfig.json:

{
    "compilerOptions": {
        "module": "amd",
        "noImplicitAny": true,
        "removeComments": true,
        "preserveConstEnums": true,
        "outFile": "src.js",
        "sourceMap": true
    },
    "include": [
        "src/**/*"
    ],
    "exclude": [
        "node_modules"
    ]
}

webpack.config.js:

module.exports = {  
    entry: './index.ts',  
    output: {  
        filename: './dest.js'  
    },  
    module: {  
        loaders: [{  
            test: /\.ts$/,  
            loader:'ts-loader'
        }]  
    },  
    resolve: {  
        extensions: ['.webpack.js', '.web.js', '.ts', '.js']  
    }  
}  

When I run 'webpack' the 'src.js' is not found and 'dest.js' is ok.

Thanks a lot.

Uro answered 23/6, 2017 at 4:27 Comment(0)
D
4

outFile

This configuration option is used by TS compiler when using tsc command to

Concatenate and emit output to single file.

You can read more about compiler options here.

output

This configuration option is used by Webpack to

The top-level output key contains set of options instructing webpack on how and where it should output your bundles, assets and anything else you bundle or load with webpack.

Why src.js is missing

When you use ts-loader instead of a tsc as part of webpack built, the outFile option from tsconfig.json is not used. Webpack when loading a .ts file detects that it should be passed to ts-loader, which in turn uses a compiler to compile only this one file and then returns output to a webpack. It never works with all files the way tsc does. That's why no src.js is generated.

Diderot answered 23/6, 2017 at 5:13 Comment(2)
1:But when I remove 'outFile' in tsconfig.json,the 'dest.js' without any my code,and they are default code by webpack to use amd generate.If I add 'outFile','dest.js' is ok. 2:When I remove tsconfig.json file,it tips error missing this file when I run 'webpack'.Uro
@FreeTears, _When I remove tsconfig.json file,it tips error missing this file when I run 'webpack'_ - ts-loader` uses this file for many things other than outFile option, so it's required. Didn't understand your first point about outFile, can you elaborate?Diderot

© 2022 - 2024 — McMap. All rights reserved.