Styled component, eslint with react native gets "no-unused-vars"

Question

'Text' is defined but never used  no-unused-vars

Here is the code section gets error

import {
  Text,
  StyleSheet,
} from 'react-native';
import color from './color';

export const Sub = styled.Text`
  color: ${color.secondary};
  font-size: 16;
  text-align: center;
  margin: 8px;

as we can see the Text has been consumed by Sub, since we don't want remove the no-unused-vars rule, we may need a plugin or setting to walk-around this

---

Thanks @Dan, you saved me from my tunnel vision

Answer 1

Assuming that Text is a component, the documentation says that the correct way to declare it is:

export const Sub = styled(Text)`
  color: ${color.secondary};
  font-size: 16;
  text-align: center;
  margin: 8px;
`

It would also solve the eslint issue.