Failing with webpack --watch on file change

[bitspook]

Here's my webpack.config:

    module: {
        loaders: [
            {
                test: /\.js$/,
                include: [
                    path.resolve(__dirname, 'src'),
                ],
                loader: 'babel',
            },
            {
                test: /\.ts(x?)$/,
                include: [
                    path.resolve(__dirname, 'src'),
                ],
                loaders: [
                    'babel',
                    'ts-loader',
                ],
            },
.
.
.
    resolve: {
        extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js']
    },

And this is tsconfig.json:

{
    "compilerOptions": {
        "target": "es2015",
        "module": "es2015",
        "sourceMap": true,
        "allowJs": true,
        "jsx": "preserve",
        "watch": true
    },
    "exclude": [
        "node_modules"
    ]
}

Typescript compiles the app first time just fine, but when I change something in the code, it fails and crashes with this error:

File changed: src/endpoint/static/app.css
/Users/channi/Documents/Work/Dear-Diary/node_modules/ts-loader/index.js:350
        var mtimes = watching.compiler.watchFileSystem.watcher.mtimes;
                                                              ^

TypeError: Cannot read property 'mtimes' of undefined
    at Compiler.<anonymous> (/Users/channi/Documents/Work/Dear-Diary/node_modules/ts-loader/index.js:350:63)
    at Compiler.next (/Users/channi/Documents/Work/Dear-Diary/node_modules/tapable/lib/Tapable.js:69:14)
    at Compiler.invalidAsyncPlugin (/Users/channi/Documents/Work/Dear-Diary/node_modules/webpack-dev-middleware/middleware.js:79:3)
    at Compiler.applyPluginsAsync (/Users/channi/Documents/Work/Dear-Diary/node_modules/tapable/lib/Tapable.js:71:13)
    at Watching._go (/Users/channi/Documents/Work/Dear-Diary/node_modules/webpack/lib/Compiler.js:44:16)
    at Watching.invalidate (/Users/channi/Documents/Work/Dear-Diary/node_modules/webpack/lib/Compiler.js:108:8)
    at Watching.<anonymous> (/Users/channi/Documents/Work/Dear-Diary/node_modules/webpack/lib/Compiler.js:93:8)
    at onTimeout [as _onTimeout] (/Users/channi/Documents/Work/Dear-Diary/node_modules/webpack/lib/node/OldNodeWatchFileSystem.js:234:3)
    at Timer.listOnTimeout (timers.js:92:15)

I am trying out typescript and ts-loader for first time, so I am not sure if this is something I am doing wrong or if this is a bug. I've tried googling, read through many boilerplates and such configs, but I can't figure out if it is me doing something wrong. Nothing I have done so far could solve this.

[jbrantly]

Are you using webpack2? From the error it sounds like it might be a webpack api change. ts-loader isn't really tracking webpack2 (yet).

[bitspook]

Hey,
No I am not using webpack 2. I am using 1.12.13. However I am using typescript 1.8, but I think that shouldn't be the cause of this issue.

[jbrantly]

Not sure then. Tests are passing with webpack 1.12.13 and ts 1.8: https://travis-ci.org/TypeStrong/ts-loader/jobs/109111991

I'll have to try your exact setup later.

[bitspook]

I was using OldWatchPlugin in my webpack config. Turns out it was the one breaking the watch for ts-loader. Removing it has solved the problem.

Thanks for your help.

[Note to self: Put in complete configs when creating issues; not snippets]