Comments (13)
Added this new rule #201
from eslint-plugin-react-native.
Awesome! I was just searching for a rule like that. One question: Will this also prevent the following example:
const foo = '' ... foo && <Component />
React Native does not evaluate
foo
asfalsy
but tries to render an empty string here.
I am using eslint-plugin-jsx-expressions
to manage this issue. Cf. jsx-eslint/eslint-plugin-react#2073 (comment)
from eslint-plugin-react-native.
Awesome! I was just searching for a rule like that.
One question: Will this also prevent the following example:
const foo = ''
...
foo && <Component />
React Native does not evaluate foo
as falsy
but tries to render an empty string here.
from eslint-plugin-react-native.
#205 only works with styled components if the styled Text component is called StyledText, does not work if several StyledText are defined, unless each of them is skipped...
from eslint-plugin-react-native.
Excellent idea! I'll see if I can have a go at it
from eslint-plugin-react-native.
no, this one is the only case that can't be handled or I didn't understand how 😄
just use !!foo
or foo.lenght > 0
for your case
from eslint-plugin-react-native.
Yes, I know. Problem is to not forget about that while writing code...
Would be great if eslint could remind you ;)
Thanks anyways!
from eslint-plugin-react-native.
Needs the ability to configure it. i.e. So you can add 'CustomStyledText' to valid text nodes if you use a Text wrapper to provide standardized text styles through your app.
Sadly even with that this quickly falls apart for me because I use styled.Text
a lot to provide locally styled Text components. And there are a few outliers like react-native-paper providing a <Button>
that accepts text.
from eslint-plugin-react-native.
can you provide a code example?
yeah, seems this rule doesn't support styled components, but need to investigate
from eslint-plugin-react-native.
Styled example:
const ContentText = styled.Text`
${material.body1Object}
color: ${colors.primaryText};
`;
Example of a "standard" wrapper:
https://github.com/material-native/material-native/blob/master/src/MaterialText.js
<MaterialText body1>Foo</MaterialText>
Or a port of MUI's Typography: https://material-ui.com/style/typography/
from eslint-plugin-react-native.
PS. Quite funny that you call your library as standard 😄
from eslint-plugin-react-native.
Standardized within an app, anyone can make their own with the typography rules for their app. That's just an example of an old one I made to wrap Text with Material Design typography classes.
from eslint-plugin-react-native.
PS. Quite funny that you call your library as standard 😄
Quite funny that you call it a fix 😄
from eslint-plugin-react-native.
Related Issues (20)
- Unhandled case no-inline-styles + typescript when add type casting `as T`
- Unhandled case no-inline-styles + typescript when add type casting `as T` HOT 1
- Eslint 8.0 error when using --fix: Fixable rules must set the `meta.fixable` property to "code" or "whitespace" HOT 1
- [Feature] Allow rules options to include message
- Eslint 8 support HOT 3
- no-raw-text gives a false positive with spaces?
- no-raw-text breaking eslint when nearby component has an inline function
- TypeError: Cannot read property 'name' of undefined
- Custom StyleSheet ordering? HOT 1
- When does eslint 8 support available? HOT 3
- Help with running the plugin?
- [no-inline-styles] ternary style gets mistakenly reported HOT 3
- Rule to warn about styles such as `textAlignVertical` that aren't multi platform (it doesn't support iOS) HOT 1
- Ensure each style property is on its own line when inside StyleSheet.create() HOT 1
- no-unused-styles: false positive with variable based style object selection HOT 7
- TypeError: this.styleSheets[styleSheetName].filter is not a function HOT 1
- Maintainers wanted! HOT 4
- [react-native/no-raw-tex] crash when have a template literals string HOT 1
- use with new eslint config system (eslint.config.js) HOT 1
- Support "Flat Config" (ESLint 9)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from eslint-plugin-react-native.