首页 > 解决方案 > react native 的自动导入在 vscode 上不起作用

问题描述

我正在开发一个反应本机应用程序,但无论我做什么,自动导入功能都不适用于 vscode。我想要的功能(如果你输入,它会自动从 React 导入 Text 模块)这就是现在发生的事情,这对我来说没有突出任何错误 我当前的问题截图

我已经寻找了一些类似的问题,但没有一个对我有帮助。我尝试修复我的 eslint 并添加了 jsconfig,但它不起作用。任何建议将不胜感激。

eslint.js:

module.exports = {
    extends: "airbnb",
    plugins: ["react", "react-native", "react-hooks"],
    parser: "babel-eslint",
    env: {
        jest: true,
        "react-native/react-native": true,
    },
    rules: {
        "no-use-before-define": "off",
        "react/jsx-filename-extension": "off",
        "react/prop-types": "off",
        "comma-dangle": "off",
        "padded-blocks": "off",
        "arrow-body-style": "off",
        "react-hooks/exhaustive-deps": "warn",
        "react-native/no-unused-styles": 2,
        "react-native/split-platform-components": 2,
        "react-native/no-inline-styles": 2,
        "react-native/no-color-literals": 2,
        "react-native/no-raw-text": 2,
        "react-native/no-single-element-style-arrays": 2,
    },
    globals: {
        fetch: false,
    },
    // Indent with 4 spaces
    indent: ["error", 4],

    // Indent JSX with 4 spaces
    "react/jsx-indent": ["error", 4],

    // Indent props with 4 spaces
    "react/jsx-indent-props": ["error", 4],
};

包.json:

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject",
    "lint": "eslint *.js **/*.js src/**/*.js"
  },
  "dependencies": {
    "expo": "~40.0.0",
    "expo-status-bar": "~1.0.3",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
    "react-native-web": "~0.13.12"
  },
  "devDependencies": {
    "@babel/core": "~7.9.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^7.20.0",
    "eslint-config-airbnb": "^18.2.1",
    "eslint-plugin-import": "^2.22.1",
    "eslint-plugin-jsx-a11y": "^6.4.1",
    "eslint-plugin-react": "^7.22.0",
    "eslint-plugin-react-hooks": "^4.2.0",
    "eslint-plugin-react-native": "^3.10.0"
  },
  "private": true
}

babel.config.js:

module.exports = function (api) {
    api.cache(true);
    return {
        presets: ["babel-preset-expo"],
    };
};

标签: reactjsreact-nativevisual-studio-code

解决方案


推荐阅读