vogievetsky commented on a change in pull request #11142: URL: https://github.com/apache/druid/pull/11142#discussion_r618602820
########## File path: web-console/README.md ########## @@ -41,18 +41,39 @@ To try the console in (say) coordinator mode you could run it as such: You should use a TypeScript friendly IDE (such as [WebStorm](https://www.jetbrains.com/webstorm/), or [VS Code](https://code.visualstudio.com/)) to develop the web console. -The console relies on [tslint](https://palantir.github.io/tslint/), [sass-lint](https://github.com/sasstools/sass-lint), and [prettier](https://prettier.io/) to enforce the code style. - -If you are going to do any non-trivial development you should set up file watchers in your IDE to automatically fix your code as you type. - -If you do not set up auto file watchers then even a trivial change such as a typo fix might draw the ire of the code style enforcement (it might require some lines to be re-wrapped). -If you find yourself in that position you should run on or more of: - -- `npm run tslint-fix` -- `npm run sasslint-fix` -- `npm run prettify` - -To get your code into an acceptable state. +The console relies on [eslint](https://eslint.org) (and various plugins), [sass-lint](https://github.com/sasstools/sass-lint), and [prettier](https://prettier.io/) to enforce code style. If you are going to do any non-trivial development you should set up your IDE to automatically lint and fix your code as you make changes. + +#### Configuring WebStorm + +- **Preferences | Languages & Frameworks | JavaScript | Code Quality Tools | ESLint** + - Select "Automatic ESLint Configuration" + - Check "Run eslint --fix on save" + +- **Preferences | Languages & Frameworks | JavaScript | Prettier** + - Set "Run for files" to `{**/*,*}.{js,ts,jsx,tsx,css,scss}` + - Check "On code reformat" + - Check "On save" + +#### Configuring VS Code +- Install `dbaeumer.vscode-eslint` extension +- Install `esbenp.prettier-vscode` extension +- Open User Settings (JSON) and set the following: + ```json + "editor.defaultFormatter": "esbenp.prettier-vscode", + "editor.formatOnSave": true, + "editor.codeActionsOnSave": { + "source.fixAll.eslint": true + } + ``` + +#### Auto-fixing manually +It is also possible to auto-fix and format code without making IDE changes by running the following scripts: + +- `npm run eslint-fix` — run code linter and fix issues +- `npm run sasslint-fix` — run style linter and fix issues +- `npm run prettify` — reformat code and styles Review comment: Should there be an `npm run autofix` that just does all 3 of those in order? -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. For queries about this service, please contact Infrastructure at: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
