initialized property that references this triggers "referenced directly or indirectly in its own initializer." when referenced outside the constructor

[nevir]

This seems like a bug; but let me know if this would be better suited for SO

TypeScript Version: 2.4.1 (and prior)

Code

import * as React from 'react';
import * as dapper from '@convoy/dapper';

const STYLES = dapper.compile({
  root: { padding: 10 },
});

export class App extends React.Component {
  styles = dapper.reactTo(this, STYLES);

  render() {
    return <div className={this.styles.root}>;
  }
}

Expected behavior:

Compiles without complaint

Actual behavior:

When render() references this.styles.root, both styles and render are flagged with:

'[property]' implicitly has type 'any' because it does not have a type annotation and is referenced directly or indirectly in its own initializer.

If I remove the reference to this.styles.root, neither property has an error. Also, the type of styles appears correctly inferred as { root: string }

[mhegazy]

The type of the property depends on the type of the class, which includes the type of the property. the compiler breaks these circular dependencies by giving declarations the type any. the error message tells you that this occurred. adding an explicit type annotation to styles declaration should avoid the issue.

[mhegazy]

Automatically closing this issue for housekeeping purposes. The issue labels indicate that it is unactionable at the moment or has already been addressed.