CODEWITHSUNDEEP
reactjstypescriptwebpack
CodeDog
CodeDog

Reputation: 643

Webpack hot reloading stops on wrong typings error

I've got a project in React + Typescript + Webpack stack and I'm using react-data-grid package with @types/react-data-grid package. The problem is that the typings provided in @types/react-data-grid are not complete. Which results in typescript error when trying to use one of the properties. However I know this property exists and it's just the matter of incomplete typings. So I've got two issues I would like to resolve:

  1. Add appropriate typings that would work together with @types/react-data-grid. Is there and option to that? That somehow typescript compiler would merge my new typings with @types/react-data-grid and stop showing the error?

  2. Enable Hot Reloading in Webpack. Even thought the typings error is shown ,still the bundle is created and after refreshing page while using webpack-dev-server. So I can actually develope but it would be nicer to have hot reloading. Is there an option to tell webpack-dev-server to ignore typescript errors? I just want to do it in the meantime and later fix the issue with Ad. 1.

I am using:

"ts-loader" : "^4.1.0",
"typescript" : "^2.7.2",
"webpack": "^4.2.0",
"webpack-cli": "^2.0.13",
"webpack-dev-server": "^3.1.1"

Upvotes: 5

Views: 1357

Answers (1)

smnbbrv
smnbbrv

Reputation: 24531

Answering the question 1.

Generally you cannot. It can be that you will be able to extend their typings by extending their classes / interfaces and use your extended versions, however it is way better to extend the types by making a pull request at https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types which is where the @types/* are coming from

Answering the question 2.

This is what is coming from ts-loader docs

The build should fail on TypeScript compilation errors as of webpack 2. If for some reason it does not, you can use the webpack-fail-plugin.

It is done for good, because otherwise you will end up fixing production bugs before the release when you have already forgotten everything you did instead of fixing the errors while writing the actual code. Probably this could be disabled by using transpileOnly option.

Another option is using awesome-typescript-loader instead of ts-loader which has a errorsAsWarnings option

Upvotes: 2

Related Questions