Skip to content

Add custom eslint formatter #2138

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
May 14, 2017
Merged

Add custom eslint formatter #2138

Changes from 1 commit
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
f7b48ab
Add custom eslint formatter
sidoshi May 12, 2017
4bb2bf0
Add formatter docs
sidoshi May 12, 2017
d24ef7d
Update formatter docs
sidoshi May 12, 2017
4bf55de
Slightly tweak it
gaearon May 14, 2017
39a0f26
Update README.md
gaearon May 14, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 37 additions & 0 deletions packages/react-dev-utils/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -166,6 +166,43 @@ compiler.plugin('done', function(stats) {
});
```

#### `formatter(results: Object): string`
Copy link
Contributor

@gaearon gaearon May 14, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's make it eslintFormatter instead?


Copy link
Contributor

@gaearon gaearon May 12, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe "This is our custom ESLint formatter that integrates well with Create React App console output. You can remove it and use the default one instead."

This is an eslint formatter that takes the result generated from eslint and formats the output string

```js
const formatter = require('react-dev-utils/formatter');
const webpack = require('webpack');

module: {
Copy link
Contributor

@gaearon gaearon May 12, 2017 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's not very clear this is Webpack config. I'd prefer that we show a specific ESLint rule alone, with a comment like

// ESLint loader in your webpack config:
// ...

strictExportPresence: true,
rules: [
{ parser: { requireEnsure: false } },
{
test: /\.(js|jsx)$/,
enforce: 'pre',
use: [
{
// @remove-on-eject-begin
Copy link
Contributor

@gaearon gaearon May 12, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nobody knows what @remove-on-eject-begin means. This is our internal thing. Please remove it from the doc.

// Point ESLint to our predefined config.
options: {
formatter,
baseConfig: {
extends: ['react-app'],
},
ignore: false,
useEslintrc: false,
},
// @remove-on-eject-end
loader: 'eslint-loader',
},
],
include: paths.appSrc,
}
]
}
```

#### `getProcessForPort(port: number): string`

Finds the currently running process on `port`.
Expand Down