Далее. js псевдонимы импорта машинописного текста с помощью babel-plugin-module-resolver - PullRequest
0 голосов
/ 16 апреля 2020

Я настраиваю проект Next. js с машинописью. Я следовал нескольким инструкциям, но мне кажется, что я столкнулся с проблемой с псевдонимами импорта.

Я не уверен, что это проблема с моей конфигурацией или с Next. js.

Вот несколько страниц, ссылающихся на похожие проблемы, советы которых я безуспешно следовал:

Я попытался поэкспериментировать с конфигурацией веб-пакета Next. js ', чтобы решить эту проблему (добавив параметры resol.alias непосредственно в next.config. js, но это не помогло, и Next . js предположительно теперь поддерживает машинописный ввод из коробки (resol.extensions четко определены)

Далее. js версия 9.3.5

b abel-plugin-module-resolver версия 4.0.0

tsconfig. json

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "baseUrl": ".",
    "paths": {
      "@components/*": ["./components/*"],
      "@icons/*": ["./assets/icons/*"],
      "@views/*": ["./views/*"]
    }
  },
  "exclude": [
    "node_modules"
  ],
  "include": [
    "next-env.d.ts",
    "**/*.ts",
    "**/*.tsx"
  ]
}

.babelr c

{
  "presets": [ "next/babel" ],
  "plugins": [
    "inline-react-svg",
    ["module-resolver", {
      "root": ["./"],
      "alias": {
        "@components": "./components",
        "@icons": "./assets/icons",
        "@views": "./views"
      }
    }]
  ]
}

1 Ответ

0 голосов
/ 16 апреля 2020

Подумав об этом, я понял, что пытаюсь сделать две вещи:

  • Обработка псевдонимов машинописного текста
  • Использование babel-plugin-inline-реагировать-svg для импорта SVGS

Предоставленная конфигурация действительно работает для обычного импорта машинописного текста, однако эта конфигурация не позволяет импортировать svg для псевдонимов, я безуспешно пытался добавить расширение к module-resolver.

Проведя еще какое-то исследование, я обнаружил, что на babel-plugin-inline-Reaction-svg решается нерешенная проблема: https://github.com/airbnb/babel-plugin-inline-react-svg/pull/17

Кажется, это известная проблема совместимости между babel-plugin -module-resolver и babel-plugin-inline-реагировать-svg.

...