While coding, I was not using eslint. Now I installed it and it has flooded my editor with prettier/prettier errors, which by no way seem like they make my code prettier. I am looking to find a way to solve this.
prettierrc.js:
module.exports = {
bracketSpacing: true,
jsxBracketSameLine: false,
singleQuote: true,
trailingComma: 'all',
};
eslintrc.js:
module.exports = {
root: true,
extends: '@react-native-community',
};
And finally, some example code:
import React, {Component} from 'react';
import {View, Text, Picker} from 'react-native';
import {connect} from 'react-redux';
import {employeeUpdate} from '../actions';
import {CardSection, Input} from './common';
class EmployeeForm extends Component {
render(){
return (
<View>
<CardSection>
<Input
label="Name"
placeholder="Marco"
value={this.props.name}
onChangeText={value => this.props.employeeUpdate({prop: 'name', value})}
/>
</CardSection>
<CardSection>
<Input
label="Phone"
placeholder="555-5555"
value={this.props.phone}
onChangeText={value => this.props.employeeUpdate({prop: 'phone', value })}
/>
</CardSection>
<CardSection style={{ flexDirection: 'row'}}>
<Text style={styles.pickerTextStyle}>Shift</Text>
<Picker
style={{flex: 1}}
selectedValue={this.props.shift}
onValueChange={value => this.props.employeeUpdate({prop: 'shift', value})}
>
<Picker.Item label="Monday" value="Monday" />
<Picker.Item label="Tuesday" value="Tuesday"/>
<Picker.Item label="Wednesday" value="Wednesday"/>
<Picker.Item label="Thursday" value="Thursday"/>
<Picker.Item label="Friday" value="Friday"/>
<Picker.Item label="Saturday" value="Saturday"/>
<Picker.Item label="Sunday" value="Sunday"/>
</Picker>
</CardSection>
</View>
);
}
}
I am simply trying to remove the error since it is annoying to have thousands of red dots looking to make my code "prettier", which is not achieving.
Instead of disabling linting for the file, you can instead disable prettier within the eslintrc.js config file:
module.exports = {
root: true,
extends: '@react-native-community',
rules: {
'prettier/prettier': 0,
},
};