Ts-loader: webpack 4 things to do

[johnnyreilly]

List of things that we need to do to make ts-loader compatible with webpack 4:

• remove: https://github.com/TypeStrong/ts-loader/blob/ba72dfc661c805dce52bdf5ba58a351ef4d08976/src/index.ts#L95

• moved to use the new enhanced-resolve: https://github.com/webpack/enhanced-resolve

[etroynov]

any news?

[Kocal]

He is actively working on it (https://github.com/TypeStrong/ts-loader/pull/710) :+1:

[johnnyreilly]

Yup - beta available: https://blog.johnnyreilly.com/2018/01/webpack-4-ts-loader-fork-ts-checker.html

[jrmyio]

@johnnyreilly Is the new Weback 4 "sideEffects" supposed to work wtih typescript?

It seems that I can only get it to work with babel-loader, and not with ts-loader.

(trying to use import {isString} from 'lodash-es';without pulling in the entire lodash during build).

[johnnyreilly]

AFAIK there's nothing required for loaders to do. Let me know if you know otherwise.

[jrmyio]

@johnnyreilly It seems you have to pipe it through babel in order for it to tree-shake. I am using the following webpack configuration for the prod env:

[{

    // We are piping through babel to get Webpack 4 Tree Shaking support with { 'sideEffects' : false }
    loader: 'babel-loader'
}, {
    loader: 'ts-loader',
    options: ({
        transpileOnly: true,

        // Since we are piping trough babel we have to target es2016
        compilerOptions: {
            target: "es2016",
            module: "es2015"
        },
    })
}]

[cecilemuller]

Webpack does the tree shaking, not Babel (Babel merely doesn't modify the import/export statements), you can have tree shaking even without Babel 😃

[jrmyio]

@cecilemuller I guess in the context of es5 exporting with typescript