Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

TypeScript issue - TypeError: Cannot read property 'watchRun' of undefined

Im trying to convert the JSX files of my ReactJS app, one by one to TS. Hence I will have both JSX and TS files running at the same time. (Hence added rules for both in webpack as given below):

This is the part of my webpack config that processes jsx and ts files:

module: {
        rules: [
            {
            test: /\.ts$/,
            exclude: /node_modules/,
            use: ["awesome-typescript-loader"]
        },
        {
            test: /\.(jsx?)$/,
            exclude: /node_modules/,
            use: ["babel-loader"]
        },
        ]
    }

But when I run webpack, Im getting the following error:

Module build failed: TypeError: Cannot read property 'watchRun' of undefined

Packages used:

"webpack": "^2.2.1"
"awesome-typescript-loader": "^5.0.0-1", 
"typescript": "^2.7.2",
"@types/react": "^16.0.40",
"@types/react-dom": "^15.5.7",
"babel-core": "^6.23.1",
"babel-loader": "^6.4.0",

I looked up online but nowhere I could find resources giving hint on this watchRun issue.

Thanks.

like image 391
Ivin Avatar asked Mar 08 '18 04:03

Ivin


People also ask

What is cannot read property of undefined in JavaScript?

The TypeError: Cannot read property of undefined is one of the most common type errors in JavaScript. It occurs when a property is read or a function is called on an undefined variable. TypeError: Cannot read properties of undefined (reading x) Undefined means that a variable has been declared but has not been assigned a value.

What is the return type of undefined in typescript?

In Regular Type Check Mode, TypeScript is aware that a function might return undefined. But at the same time, TypeScript infers the return type to be only of type string because TypeScript is widening the undefined type to string type.

Why does thistype () not work in typescript?

Presumably the issue depends on Typescript's js support. Sorry, something went wrong. No, it's more likely that the binder doesn't recognise this construction as a class and doesn't mark it with the Class flag. When that flag is missing, the code in the checker that adds thisType doesn't run, and subsequent code (like this) will crash.

What is strict type check mode in typescript?

Until TypeScript 2.0, there was only one type check mode - regular - and it considers null and undefined as subtypes of all other types. This means null and undefined values are valid values for all types. TypeScript 2.0 introduced Strict Type Check Mode (also referred to as strict null checking mode).


1 Answers

The awesome-typescript-loader 5.x is compatible with webpack 4.x, your webpack version is too old. Try upgrading your webpack to 4.x or downgrading your awesome-typescript-loader version.

like image 117
pamler Avatar answered Oct 29 '22 16:10

pamler