Как исправить ошибку разбора VSCode ESLint: «импорт» и «экспорт» могут появляться только на верхнем уровне

Question

ПРИМЕЧАНИЕ. Код работает, только ESLint выдает ошибку, которую я хочу исправить !!

При выполнении динамического c импорта:

if (true) import x from 'y'; //Parsing error: 'import' and 'export' may only appear at the top level

my. eslintr c

{
  "root": true,
  "extends": "eslint:recommended",
  "env": {
    "es6": true,
    "node": true,
    "browser": true
  },
  "parserOptions": {
    "ecmaVersion": 10,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "rules": {
    "strict": 0,
    "no-undef": 2,
    "accessor-pairs": 2,
    "comma-dangle": [2, "always-multiline"],
    "consistent-return": 2,
    "dot-notation": 2,
    "eqeqeq": 2,
    "indent": [2, 2, {"SwitchCase": 1}],
    "no-cond-assign": 2,
    "no-constant-condition": 2,
    "no-eval": 2,
    "no-inner-declarations": [0],
    "no-unneeded-ternary": 2,
    "radix": 2,
    "semi": [2, "always"],
    "camelcase": 2,
    "comma-spacing": 2,
    "comma-style": 2,
    "eol-last": 2,
    "linebreak-style": [2, "unix"],
    "new-parens": 2,
    "no-lonely-if": 2,
    "no-multiple-empty-lines": 2,
    "no-nested-ternary": 2,
    "no-spaced-func": 2,
    "no-trailing-spaces": 2,
    "operator-linebreak": 2,
    "quotes": [2, "single"],
    "semi-spacing": 2,
    "space-unary-ops": 2,
    "arrow-parens": 2,
    "arrow-spacing": 2,
    "no-class-assign": 2,
    "no-dupe-class-members": 2,
    "no-var": 2,
    "object-shorthand": 2,
    "prefer-const": 2,
    "prefer-spread": 2,
    "prefer-template": 2
  },

я уже пробовал:
... переключение ecmaVersion на 11, 2018, 2019, 2020, которые дают мне либо неправильный номер, либо парсер больше не работает
... добавлено parser: babel-eslint, из-за чего парсер больше не работает
... добавлено allowImportsExportsAnywhere: true, который ничего не сделал

Answer 1

Может быть, вы можете использовать в этой структуре

const x =
  your condition ? require("y") : () => null;

В вашем компоненте

{ your condition ?(<x/>):("")}

Answer 2

См. https://eslint.org/blog/2019/08/eslint-v6.2.0-released#highlights

В этом выпуске добавлена ​​поддержка синтаксиса ES2020, включая поддержку Dynami c Imports и BigInt. Это можно включить, используя ecmaVersion: 2020 в вашем файле конфигурации.

Казалось бы, рекомендуется добавить это в ваш файл .eslintrc.json и перезагрузить vscode:

"parserOptions": {
  "ecmaVersion": 2020,
  "sourceType": "module",
  "ecmaFeatures": {
    "jsx": true
  }
},

или "ecmaVersion": 11, это то же самое.

Но Я получаю другую опцию ошибки о недействительном ecmaVersion, когда я делаю это. Кажется, это устраняет эту ошибку :

"env": {
    "browser": true,
    "node": true,
    "es2020": true
},

и нет ecmaVersion в parserOptions! По-видимому, vscode-версия eslint не поддерживает "ecmaVersion": 2020 пока.

Answer 3

Похоже, синтаксис неправильный. Попробуйте это:

if (true) 
  import('y').then((x) => {
     console.log(x);
  });