Generator-jhipster: no-console tslint rule should be disabled for React

[cmoine]

Overview of the issue

Dear JHipster team,

I am not a React expert, but I think that
console.log('Hello')
should be allowed in React, wheareas the tslint rule no-console complains.

This thread lead me to that conclusion:
https://stackoverflow.com/questions/40647361/console-logging-for-react

Reproduce the error

Type console.log('Hello'); in a tsx file.

Suggest a Fix

Disable no-console rule when generating React front-end

JHipster Version(s)

5.0.0.beta1

JHipster configuration, a .yo-rc.json file generated in the root folder

.yo-rc.json file

{
  "generator-jhipster": {
    "promptValues": {
      "packageName": "org.cmoine.raspi"
    },
    "jhipsterVersion": "5.0.0-beta.1",
    "baseName": "Raspi3",
    "packageName": "org.cmoine.raspi",
    "packageFolder": "org/cmoine/raspi",
    "serverPort": "8080",
    "authenticationType": "jwt",
    "cacheProvider": "ehcache",
    "enableHibernateCache": true,
    "websocket": "spring-websocket",
    "databaseType": "sql",
    "devDatabaseType": "mysql",
    "prodDatabaseType": "mysql",
    "searchEngine": false,
    "messageBroker": "kafka",
    "serviceDiscoveryType": "eureka",
    "buildTool": "gradle",
    "enableSwaggerCodegen": true,
    "jwtSecretKey": "replaced-by-jhipster-info",
    "clientFramework": "react",
    "useSass": false,
    "clientPackageManager": "yarn",
    "applicationType": "monolith",
    "testFrameworks": [],
    "jhiPrefix": "jhi",
    "otherModules": [],
    "enableTranslation": false
  }
}

JDL for the Entity configuration(s) entityName.json files generated in the .jhipster directory

JDL entity definitions

Environment and Tools

java version "1.8.0_172"
Java(TM) SE Runtime Environment (build 1.8.0_172-b11)
Java HotSpot(TM) 64-Bit Server VM (build 25.172-b11, mixed mode)

node: v10.1.0

npm: 5.6.0

yarn: 1.6.0

[jdubois]

I guess this is to push "best practices" and to use a debugger instead of using the console, but yes it's a bit far-fetched, and not that user friendly (I do a lot of "console" myself to be honest)

[cmoine]

:D Yes we all do. It is of course a very minor enhancement, but the reason I share this with you is because console.log are discouraged in.... Angular, but not in React ! It is why we shoudl definitly remove this rule for React because it is confusing.

[jdubois]

Oh and we should have tslint rules which are similar for both, and I'm pretty sure we accept this in Angular (as I'm doing it!)

[deepu105]

I'm sorry but using console.log is a bad practice in the frontend world regradless of Angular and React and is heavily misused in front end by backend developers especially :wink:
I will not be ok to remove it. If you want to use it on a specific file use the tslint comments to turn it off where necessary. To me using console log is same as using sysout in java.

JHipster also provides a logger in the react app so you should rather use that for logging https://github.com/jhipster/react-jhipster/blob/master/src/util/log-util.ts

[cmoine]

Good point, it seems that console.log are also possible in Angular :)

I will go to sleep less stupid tonight :) I guess we can close this ticket then.

[cmoine]

I always wish I can bring my 2 cents to this wonderfull projet, but I am still a "little padawan" regarding front end technologies :) (I brought my 2 cents regarding gradle scripts 6 month ago :D )

[deepu105]

@cmoine thanks for your contribution, size doesnt matter :)

[deepu105]

In angular also we have the rule, only console.error and console.log is allowed, maybe console.log should be disallowed as well

        "no-console": [
            true,
            "debug",
            "info",
            "time",
            "timeEnd",
            "trace"
        ],