search

ricardofbarros / linter-js-standard

Atom linter plugin for JavaScript, using JavaScript Standard Style
https://atom.io/packages/linter-js-standard
MIT License
99 stars 50 forks source link

Static class properties: `[property name] is not defined` error #218

Closed maniart closed 6 years ago

maniart commented 6 years ago

Following this resolved issue I added eslint-parser to my configuration, and now static class properties are correctly parsed. Great. However, i'm running into another issue where I get a [property name] is not defined error.

Standard.js config:

"standard": {
    "ignore": [
      "__mocks__/**/*"
    ],
    "parser": "babel-eslint"
  }

Example code:

class Layout extends Component {
  static propTypes = {
    title: PropTypes.string,
    children: PropTypes.any
  }
}

Standars.js output

'propTypes' is not defined

Am I missing something? Is this already addressed? Thank you.

sonicdoe commented 6 years ago

Does the output actually read propTypes, not PropTypes? Keep in mind that you’ll need to import PropTypes from 'prop-types' since React v15.5 (see React’s docs).

Also, extend should be extends in your example.

maniart commented 6 years ago

@sonicdoe thanks much for the prompt response. I have indeed imported PropTypes via import PropTypes from 'prop-types' - corrected the extends typo in the issue as well.

I can verify that the issue is with lowercase propType

screen shot 2018-03-22 at 1 01 00 pm

sonicdoe commented 6 years ago

Your issue sounds similar to https://github.com/standard/standard/issues/1049. Are you using decorators by any chance?

If not, could you post a full example and your standard and babel-eslint version?

maniart commented 6 years ago

@sonicdoe Not using decorators.

Versions:

"babel-eslint": "^8.2.2",
"standard": "^10.0.3"

Standard.js config via package.json:

"standard": {
    "ignore": [
      "__mocks__/**/*"
    ],
    "parser": "babel-eslint"
  },

Example code:

/* Third Party */
import React, { Component, Fragment } from 'react'
import PropTypes from 'prop-types'
import Head from 'next/head'

export default class ArchitizerLayout extends Component {
  static propTypes = {
    title: PropTypes.string,
    children: PropTypes.any
  }

  static defaultProps = { 
    title: 'Architizer'
  }

  render () {
    const {
      title,
      children
    } = this.props

    return (
      <Fragment>
        <Head>
          <title>
            { title }
          </title>
        </Head>
        { children }
      </Fragment>
    )
  }
}

As the example demonstrates, i'm using Next.js. Thanks.

sonicdoe commented 6 years ago

Thank you, I was now able to reproduce this issue. It seems like standard v11 fixes this (probably due to updating eslint from ~3.19.0 to ~4.18.0). Could you try updating standard?

maniart commented 6 years ago

@sonicdoe updating standard to 11 fixed it. Thank you! ✨

maniart commented 6 years ago

@sonicdoe Feel free to close this. 🙏