1

I'm using PhpStorm 2018.1, and coding a ReactJS based project. I was a little annoyed with the red underline which seemed to say that my code was error even though it wasn't.

Problem no.1 Problem no.2

I have followed the answers given from this forum:

  1. WebStorm/PhpStorm warning for react attributes in jsx like className
  2. PHPStorm JSX/React syntax highlighting

but this red underline still appears.

I installed a few plugins for JavaScript and ES6 debugging enter image description here enter image description here

The question is is there another PhpStorm plugin that I didn't install?

LazyOne
  • 158,824
  • 45
  • 388
  • 391
Ryuujo
  • 613
  • 1
  • 9
  • 26
  • 1
    Well .. from what I see your 2nd screenshot clearly shows the reason -- configure your JSHint to reflect that ES6 version is used here. If you do not use/do not need JSHint ... then just disable that inspection (use search box in Settings/Preferences to quickly narrow the possible location). – LazyOne Feb 08 '19 at 09:20
  • @LazyOne If I disable JSHint, does that affect with my debugging the code? Is there any alternative debugger like this for React? – Ryuujo Feb 08 '19 at 09:51
  • 1
    JSHint is a linter ... and has nothing to do with actually running or debugging your code. – LazyOne Feb 08 '19 at 09:52

1 Answers1

3

These errors are reported by JShint linter, not by PhpStorm itself. You have to tell JSHint that you are using ES2015 syntax. This can be done by adding

/*jshint esversion: 6 */

comment to your file (http://jshint.com/docs/options/#esversion), or by specifying


{
  "esversion": 6
}

in .jshintrc file. If you don't have your own config file, you can enable EcmaScript.next in Relaxing options in Settings | Languages & Frameworks | JavaScript | Code Quality Tools | JSHint

If you didn't mean to use JSHint for linting your React application (and I'd say that this linter is a bit outdated and doesn't work well for JSX + ES6), just disable it by unchecking Enable in Settings | Languages & Frameworks | JavaScript | Code Quality Tools | JSHint

lena
  • 90,154
  • 11
  • 145
  • 150
  • Thanks, some major "error" was fixed but it still has some error in other line. So I just disable it – Ryuujo Feb 08 '19 at 09:50