vue.config.js configureWebpack not used in unit tests (vue 3)-CodePudding

In my vue config I have the following:

configureWebpack: {
  resolve: {
    alias: {
      react: path.resolve(__dirname, 'composition/react'),
      hooks: path.resolve(__dirname, 'composition'),
    },
  },
},

In my component I have the following:

import { useEffect, useState } from 'react';

This is so I can re use some of the Vue code in React projects. This works when running and building the project but not when testing. When unit testing I get the error: Cannot find module 'react' from 'useCategories.js', the above import is from useCategories.

The following is in the jest.config.js:

module.exports = {
  preset: '@vue/cli-plugin-unit-jest',
  transform: {
    '^. \\.vue$': 'vue-jest'
  }
}

If unit testing in vue is ignoring values from vue.config.js then how can I set the webpack path resolve values for testing. I would rather not repeat these values but if it's a JavaScript file I guess I can import it from the same file in different configs.

CodePudding user response：

Webpack isn't used in Jest, this would make module testing impractical, so Webpack config cannot affect anything.

As the documentation explains, it's necessary to provide module mapping in Jest config as well, e.g.:

moduleNameMapper: {
  '^react$': '<rootDir>/composition/react',
  ...