Vue / Jest "Невозможно прочитать свойство 'компоненты' из неопределенного"

Question

ПРОБЛЕМА НАЙДЕНА, ЧИТАЙТЕ НИЖЕ

В настоящее время, после дней и дней конфигураций, я приближаюсь к концу конфигурации. Надеюсь.

Распространенные проблемы: «Невозможно прочитать компоненты« свойства »неопределенных» и [Vue warn]: не удалось смонтировать компонент: шаблон или функция визуализации не определена.

Даже самые базовые c из базовых c тестов, как показано ниже, отбрасывают Vue ошибок.

//import { mount } from "@vue/test-utils";
mount = require('@vue/test-utils').mount;
var pma = require('../components/profile-licenses').default;

let nacho;

beforeEach(() => {
    nacho = mount(pma)
});

afterEach(() => {
    nacho.destroy()
});

describe('ccp', () => {
    test('is a Vue instance', () => {
        expect(nacho.isVueInstance).toBeTruthy();
    });
});

Приведенное выше решение используется для устранения [Vue предупреждения]: Не удалось смонтировать компонент: шаблон или функция визуализации не определены. Однако это не идеально. Это приводит к большему количеству ошибок и действует так, как будто он вообще не видит vue -test-utils.

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

TypeError: Cannot read property 'components' of undefined
TypeError: Cannot read property 'isVueInstance' of undefined
TypeError: Cannot read property 'destroy' of undefined

Вот мои настройки .

пакет. json

{
"scripts": {
        "dev": "cross-env NUXT_PORT=8080 nuxt-ts",
        "build": "nuxt-ts build",
        "test": "jest"
    },
    "dependencies": {
        "@babel/runtime": "^7.7.7",
        "@nuxt/typescript-runtime": "^0.3.6",
        "@nuxtjs/axios": "^5.9.2",
        "@nuxtjs/pwa": "^3.0.0-beta.19",
        "@vue/cli": "^3.11.0",
        "body-parser": "^1.19.0",
        "cross-env": "^6.0.3",
        "mem": "^6.0.1",
        "nuxt": "^2.11.0"
    },
    "devDependencies": {
        "@babel/core": "^7.8.3",
        "@babel/preset-react": "^7.8.3",
        "@babel/preset-stage-0": "^7.8.3",
        "@babel/preset-typescript": "^7.8.3",
        "@nuxt/typescript-build": "^0.5.5",
        "@types/jest": "^24.9.1",
        "@vue/server-test-utils": "^1.0.0-beta.31",
        "@vue/test-utils": "^1.0.0-beta.30",
        "babel-core": "^7.0.0-bridge.0",
        "babel-jest": "^24.9.0",
        "babel-loader": "^8.0.6",
        "jest": "^25.1.0",
        "nuxt-start": "^2.11.0",
        "ts-jest": "^24.3.0",
        "vue-jest": "^3.0.5",
        "vue-loader": "^15.8.3",
        "vue-template-compiler": "^2.6.11",
        "webpack-dev-server": "^3.10.1"
    },
    "babel": {
        "presets": [
            "@babel/preset-env",
            "@babel/preset-react",
            "@babel/preset-typescript"
        ],
        "plugins": [
            "@babel/plugin-transform-runtime"
        ]
    },
    "jest": {
        "moduleFileExtensions": [
            "ts",
            "js",
            "json",
            "vue"
        ],
        "transform": {
            "^.*\\.(vue)$": "<rootDir>/node_modules/vue-jest",
            "^.+\\.js$": "<rootDir>/node_modules/babel-jest",
            "^.+\\.ts$": "<rootDir>/node_modules/ts-jest"
        },
        "transformIgnorePatterns": [
            "/node_modules/(?!(@babel/preset-typescript)/)"
        ],
"moduleNameMapper": {
            "@/(.*)$": "<rootDir>/$1",
            "vue$": "vue/dist/vue",
            "^vue$": "vue/dist/vue.common.js"
},
        "moduleDirectories": [
            ".",
            "node_modules",
            "client"
        ]
   }

webpack.config

var path = require('path').default;
const VueLoaderPlugin = require('node_modules/vue-loader/lib/plugin').default;
module.exports = {
    module: {
      loaders: [
        {exclude: ['node_modules'], loader: 'babel', test: /\.jsx?$/},
        {loader: 'style-loader!css-loader', test: /\.css$/},
        {loader: 'url-loader', test: /\.gif$/},
        {loader: 'file-loader', test: /\.(ttf|eot|svg)$/},
        {loader: 'vue-loader', test: /\.vue$/},
        {options: {
            loaders: {
            },
            esModule: false
          }}
      ],
      rules: [
        {
          test: /\.js$/,
          exclude: /node_modules/,
          use: [
            {
              loader: 'babel-loader',
              options: {
                cacheDirectory: true,
                presets: ['es2015']
              }
            }
          ]
        }, {
          test: /\.vue$/,
          exclude: /node_modules/,
          use: [
            {
              loader: 'vue-loader'
            }
          ]
        },
        {
          test: /\.js$/,
          include: [
            path.resolve(process.cwd(), 'node_modules/')
          ],
          use: [
            {
              loader: 'babel-loader',
              options: {
                plugins: ['transform-es2015-block-scoping'],
                cacheDirectory: true
              }
            }
          ],
        },
      ]
    },
    resolve: {
      alias: {
        'vue$': 'vue/dist/vue.esm.js'
         },
      extensions: [ '.vue', '.ts', '.js'],
      modules: [
        'node_modules'
      ],
      plugins: [ new VueLoaderPlugin() ]
    }
  };

Я не удивлюсь, если это будет ошибка конфигурации. Я был в бесконечной конфигурации в течение нескольких дней. Все решения, которые я пробовал до сих пор, не работают. Я пытаюсь настроить тестирование для проекта, который имеет много компонентов и не является SPA.

РЕДАКТИРОВАТЬ: Это на самом деле не проблема с конфигурацией! По крайней мере, в этом текущем случае.

Я попытался настроить тестирование для пары других файлов и обнаружил несколько, которые были в состоянии работать без каких-либо ошибок Vue.

Нарастающая проблема, с которой я столкнулся, была связана со странной динамикой родитель-ребенок c, о которой я даже не подозревал. У нас был Vue файл в качестве его собственного компонента, а также был всплывающий компонент.

Если присмотреться к шаблону vue, мы разбили всплывающий компонент на данные из исходного компонента. Таким образом, ошибка «Не удалось смонтировать компонент»! Потому что я никогда не говорил тесту монтировать всплывающий компонент!

Аккуратно! (и расстраивает)

Оставив этот вопрос иначе как есть по историческим причинам, тем более, что я нашел благодарность для тех людей, которые публикуют решения своих неясных проблем.