How to catch undeclared variable in React with ESLint?

I noticed the other day that ESLint lets me use undefined variables. Here's a simple example:

import React from 'react';

export default class test extends React.Component {
    render(){
        var a = b;
        var b = 1;
        return <h1>{a}</h1>
    }
}

Visual Studio Code with ESLint plugin does not draw a red line under that first 'b'. When compiled with webpack, there are no eslint errors. When running in the browser, the console doesn't even log any errors. The only way I know something is wrong is nothing is being displayed on the screen.

Weirdly enough, if i remove the 'var b = 1', ESLint will give me an error saying b is undefined.

Here is my eslint config; nothing special

{
"parser":"babel-eslint",
"plugins":[
    "react"
],
"rules":{ },
"extends":["eslint:recommended", "plugin:react/recommended"]

}

What is the problem here? And how can I configure ESLint to catch errors like this in the future?

Thanks