Jest не может обрабатывать файлы SVG, импортированные с аргументом

С @nuxtjs/svg в режиме vue-svg-loader файлы SVG импортируются как Таким образом, 1_

Но у Jest есть проблема с встроенной частью:

Could not locate module ~/assets/img/arrow-right.svg?inline mapped as:
D:\path\to\project\$1.

Please check your configuration for these entries:
{
  "moduleNameMapper": {
    "/^~\/(.*)$/": "D:\path\to\project\$1"
  },
  "resolver": undefined
}

Я попробовал оба ответа на предыдущий аналогичный вопрос но в каждом случае я получаю ту же ошибку.

Любое предложение о том, как решить эту проблему?


svg jestjs vue.js babel-jest
person drake035    schedule 26.03.2021    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Для тех, кто сталкивается с этой проблемой, решение находится здесь :

jest.config.js

module.exports = {
  moduleFileExtensions: ["js", "jsx", "json", "vue"],
  transform: {
    "^.+\\.svg": "<rootDir>/svgTransform.js",
    "^.+\\.vue$": "vue-jest",
    ".+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$": "jest-transform-stub",
    "^.+\\.jsx?$": "babel-jest"
  },
  moduleNameMapper: {
    "^@/(.*svg)(\\?inline)$": "<rootDir>/src/$1",
    "^@/(.*)$": "<rootDir>/src/$1"
  },
  snapshotSerializers: ["jest-serializer-vue"],
  testMatch: ["**/tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"],
  testURL: "http://localhost/",
  collectCoverageFrom: ["!**/src/__mocks__/**", "**/src/**/*.{js,vue}"]
};

Решающим моментом является следующее:

Вас интересует вот эта строка, "^@/(.*svg)(\\?inline)$": "<rootDir>/src/$1". Будьте осторожны, добавляйте его выше регулярного выражения по умолчанию, "^@/(.*)$": "<rootDir>/src/$1", здесь учитывается порядок.

person drake035    schedule 26.03.2021