Не удается проверить функцию с динамическим импортом с помощью Jest и babel-plugin-dynamic-import-node

Question

Я пытаюсь проверить следующую функцию:

export async function loadLocale(language) {
  return await import(`./locales/${language}.json`)
}

Со следующим кодом:

import * as utils from '@/langs/utils'

describe('language utils to interact with vue-i18n', () => {
  it('should load a given locale from file', async () => {
    const language = 'es'
    expect.assertions(1)
    const locale = await utils.loadLocale(language)
    expect(locale).toEqual({ foo: 'bar' })
  })
})

Я установил https://github.com/airbnb/babel-plugin-dynamic-import-node, потому что динамический импорт не работает в Node и должен быть заменен на require.

Это содержание es.json Я пытаюсь загрузить:

{
  "foo": "bar"
}

мой .babelrc Конфиг выглядит следующим образом:

{
  "presets": [
  "@vue/app"
  ],
  "plugins": [
    "syntax-dynamic-import"
  ],
  "env": {
    "test": {
      "plugins": ["dynamic-import-node"]
    }
  }
}

И это моя структура папок:

│   ├── langs
│   │   ├── i18n.js
│   │   ├── locales # Actual locales
│   │   │   ├── en.json
│   │   │   └── es.json
│   │   └── utils.js
├── tests
│   └── unit
│       ├── langs
│       │   ├── locales # Mocked locales
│       │   │   ├── en.json
│       │   │   └── es.json
│       │   └── utils.spec.js

Поскольку я использую конфигурацию, предоставленную vue-cli, я попытался запустить Jest с --no-cache пометьте, как упоминается в этом ответе.

Я получаю следующую ошибку:

Cannot find module 'function () {
                return require("./locales/".concat(language, ".json"));
              }' from 'utils.js'

  11 | }
  12 |
> 13 | export async function loadLocale(language) {
  14 |   return await import(`./locales/${language}.json`)
  15 | }
  16 |

  at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:169:17)
  at src/langs/utils.js:13:8

Что не имеет смысла, потому что ./locales/es.json существует! И более того, я попытался использовать require с точно таким же маршрутом из теста, и он корректно загружает его содержимое.

Есть идеи?

Answer 1

Ты используешь dynamic-import-node плагин дважды. Я сделал то же самое с

"presets": [
    "react-app",
],

Смотрите vue-cli/packages/@vue/babel-preset-app/index.js