Узнайте неиспользуемый импорт в проекте React Native

Я импортировал следующий проект React Native в VS Code.

https://github.com/callstack/react-native-paper/tree/master/пример

Затем в следующем файле в строке 15:

https://github.com/callstack/react-native-paper/blob/master/example/src/CardExample.js#L15

Я добавил (просто экспериментирую) строку:

import { StatusBar, I18nManager, AsyncStorage } from 'react-native';

как вы можете видеть в коде ниже:

/* @flow */

import * as React from 'react';
import { Alert, ScrollView, StyleSheet } from 'react-native';
import {
    Title,
    Caption,
    Paragraph,
    Card,
    Button,
    withTheme,
    type Theme,
} from 'react-native-paper';

import { StatusBar, I18nManager, AsyncStorage } from 'react-native';

type Props = {
    theme: Theme,
};

class CardExample extends React.Component<Props> {
    static title = 'Card';

    render() {
        const {
            theme: {
                colors: { background },
            },
        } = this.props;
        return (
            <ScrollView
                style = {[styles.container, { backgroundColor: background }]}
                contentContainerStyle = {styles.content}
            >
                <Card style = {styles.card}>
                    <Card.Cover source = {require('../assets/wrecked-ship.jpg')} />
                    <Card.Content>
                        <Title>Abandoned Ship</Title>
                        <Paragraph>
                            The Abandoned Ship is a wrecked ship located on Route 108 in
              Hoenn, originally being a ship named the S.S. Cactus. The second
              part of the ship can only be accessed by using Dive and contains
              the Scanner.
            </Paragraph>
                    </Card.Content>
                </Card>
            </ScrollView>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
    },
    content: {
        padding: 4,
    },
    card: {
        margin: 4,
    },
});

export default withTheme(CardExample);

моя проблема, что VS Code не становится серым и не выделяет эту новую строку с неиспользуемым импортом, как вы можете видеть на следующем изображении:

Узнайте неиспользуемый импорт в проекте React Native

Есть ли простой способ узнать о неиспользуемом импорте в этом проекте React Native, выделив этот импорт серым цветом или выполнив команду npm в командной строке?

Спасибо!

Умерло ли Create-React-App?
Умерло ли Create-React-App?
В этом документальном фильме React.dev мы исследуем, мертв ли Create React App (CRA) и какое будущее ждет этот популярный фреймворк React.
Освоение React Native: Пошаговое руководство для начинающих
Освоение React Native: Пошаговое руководство для начинающих
React Native - это популярный фреймворк с открытым исходным кодом, используемый для разработки мобильных приложений. Он был разработан компанией...
В чем разница между react native и react ?
В чем разница между react native и react ?
React и React Native - два популярных фреймворка для создания пользовательских интерфейсов, но они предназначены для разных платформ. React - это...
От React к React Native: Руководство для начинающих по разработке мобильных приложений с использованием React
От React к React Native: Руководство для начинающих по разработке мобильных приложений с использованием React
Если вы уже умеете работать с React, создание мобильных приложений для iOS и Android - это новое приключение, в котором вы сможете применить свои...
Хуки React: что это такое и как их использовать
Хуки React: что это такое и как их использовать
Хуки React - это мощная функция библиотеки React, которая позволяет разработчикам использовать состояние и другие возможности React без написания...
3
0
3 525
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

VSCode имеет встроенный параметр для отображения неиспользуемого импорта или переменных, вы можете включить/отключить в разделе настроек.

Вы можете найти раздел настроек в:

В Windows/Linux — Файл > Настройки > Настройки

В macOS — Код > Настройки > Настройки

Проверьте настройки пользователя Show Unused в разделе Text Editor.

Ответ принят как подходящий

Я бы порекомендовал использовать eslint.

Инструкцию по установке см.: https://medium.com/@deadcoder0904/eslint-setup-in-react-native-using-vscode-c3122a1da9c7

Он будет помечать неиспользованный импорт

Другие вопросы по теме