eslint-config-blueflag
Advanced tools
Weekly downloads
Readme
npm install eslint-config-blueflag
// .eslintrc
{
"extends": [
"eslint-config-blueflag",
"eslint-config-blueflag/flow.js" // With flow types
]
}
If your linter can't handle using the current directory to find binaries you will need to install the plugins globally. Make sure you install eslint 2.4.0 though. The babel parser is having issues with later versions.
# Defaults
# eslint@2.4.0
# eslint-plugin-react
#
# Flow Types
# eslint-plugin-flow-vars
# eslint-plugin-flowtype
# one liner
npm install -g eslint@2.4.0 eslint-plugin-flow-vars eslint-plugin-flowtype eslint-plugin-react@5.2.0 babel-eslint
// Good
return <ul className="List">
<li>list items</li>
<li>list items</li>
</ul>;
// Bad
return (
<ul className="List">
<li>list items</li>
<li>list items</li>
</ul>
);
####Find and replace
Find: return(\s+?)\((\s+?)<
Automatic find and replaces are hard for this. You can replace return(\s+?)\((\s+?)<
with return <
, find the closing );
and replace it with ;
and de-indent all lines between.
// Good
return <span />;
// Bad
return <span></span>;
// Good
return <ExampleComponent
title="Example"
author="Robert"
>
<p>Child elements</p>
</ExampleComponent>;
return <ExampleComponent
title="Example"
author="Robert"
/>
// Bad
return <ExampleComponent title="Example"
description="Hello"
>
<p>Child elements</p>
</ExampleComponent>;
return <ExampleComponent
title="Example"
description="Hello">
<p>Child elements</p>
</ExampleComponent>;
Find: \s+?$\s+?(/?>;?)(\s*?)
Replace: $1\n
and then fix up indentation
// Good
return fromJS(list)
.map(ii => ii.get('id'))
.sort()
.toJS();
// Bad
return fromJS(list).map(ii => ii.get('id')).sort().toJS();
return fromJS(list)
.map(ii => ii.get('id'))
.sort()
.toJS();
// Good
import React, {Component, Children} from 'react';
// Bad
import React, { Component, Children } from 'react';
// Good
Button.jsx
CreateRoutes.js
// Bad
button.jsx
createRoutes.js
// Good
src/users/
src/learningPlan/
// Bad
src/Users/
src/learning_plan/
// Good
http://example.com/free-hugs
// Bad
http://example.com/freeHugs
http://example.com/free_hugs
SEGMENT_NOUN_VERB
Underscores are reserved for the division of concept not word spaces
// Good
COURSE_ASSIGNEE_CHANGE
COURSE_DEFAULTASSIGNEE_CHANGE
// Bad
COURSECHANGE
CHANGE_COURSE_DEFAULT_ASSIGNEE
CHANGE_COURSE
courseChange
// Good COURSE_ASSIGNEE_CHANGE
courseAssigneeChange()
// Bad COURSE_ASSIGNEE_CHANGE
changeCourseAssignee()
dispatchCourseAssignee()
COURSE_ASSIGNEE_CHANGE()
Often caused by a require()
requiring a file that's using export default
. Ensure all require()
s of components with export default
use import
instead.
In React <0.15 this can happen when functional components try to return null. They must return an empty <span/>
instead. This has been fixed as of React 0.15
FAQs
[](https://www.npmjs.com/package/eslint-config-blueflag)
The npm package eslint-config-blueflag receives a total of 285 weekly downloads. As such, eslint-config-blueflag popularity was classified as not popular.
We found that eslint-config-blueflag demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 3 open source maintainers collaborating on the project.
Did you know?
Socket installs a Github app to automatically flag issues on every pull request and report the health of your dependencies. Find out what is inside your node modules and prevent malicious activity before you update the dependencies.