amhed
amhed

Reputation: 3659

EsLint from Visual Studio - Unable to use static props on javascript files

Node Modules:

Sample file being linted:

class NotepadComponent extends React.Component {
    static displayName = 'NotepadComponent'

    static defaultProps = {
        activeTab: 'type'
    }
}

Under the command line I can lint and transpile using babel without any issues. The problem is trying to lint from visual studio. I'm using the Web Analyzer plugin which internally uses esLint.

This visual studio module defines a .eslintrc file under C:\Users\My-Username and I've gone ahead and updated this file, and the main folder for node_modules using this configuration:

"parser": "babel-eslint",
"ecmaFeatures": {
    "jsx": true,
    "classes":  true
    },
    "plugins": [
        "react"
    ],
    "env": {
        "browser": true,
        "node": true,
        "es6": true,
        "jquery":  true
    },

But I still get the "JSX Parser: Unexpected Token =" error:

Any ideas on getting Web Analyzer to behave the same way the command-line tool does?

Visual Studio Linting Error

Upvotes: 3

Views: 668

Answers (2)

Tom Verschoore
Tom Verschoore

Reputation: 116

I had a same kind of a problem in combination with TSLint and Web Analyzer. It turns out Web Analyzer uses its own node_modules installation in C:\Users\[User]\AppData\Local\Temp\WebAnalyzer1.7.75. There you find also a nodeJS server(.js) that communicates the lint results to Visual Studio. I was able to adapt this server to get more error feedback in Visual Studio. This feedback told me that I should install missing npm packages in C:\Users\[User]\AppData\Local\Temp\WebAnalyzer1.7.75. and C:\Program Files (x86)\Microsoft Visual Studio 14.0\Common7\IDE. Maybe you can do the same for ESLint. See also WebEssentials tslint custom rules

Upvotes: 0

Actually in Es6 for the defaultProps you have to set it outside the class, example:

class NotepadComponent extends React.Component {
  constructor(props){
    super(props);
  }
}
NotepadComponent.defaultProps ={
                               activeTab:'type'
                               }
NotepadComponent.displayName = 'NotepadComponent'

Im not sure if it's that are you looking for, but maybe this help you

Upvotes: 0

Related Questions