I'm working on a Vue 3 project with TypeScript and Jest for unit testing. I've encountered a challenging issue when running my Jest tests, which throws the following error:

[@vue/compiler-sfc] No fs option provided to compileScript in non-Node environment. File system access is required for resolving imported types.

This error occurs when testing components that import types from @library/design-system-core. Here's an example of a component that causes the error:

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/3.3.7/vue.global.min.js"></script>
<!-- Select.vue -->
<template>
  <!-- template code here -->
</template>

<script setup lang="ts">
import type { Props as SelectProps } from '@library/design-system-core/dist/components/molecule/Select'
// Additional script setup code
</script>


What I've Tried:

  1. Ensuring all related dependencies (vue, jest, @vue/test-utils, etc.) are up to date.
  2. Using both mount and shallowMount from @vue/test-utils.
  3. Mocking the imports from @library/design-system-core using Jest's jest.mock() method.
  4. Configuring jest.config.js with moduleNameMapper to redirect imports to mocks.
  5. Writing the component using instead of to avoid potential issues related to SFC compilation.

    I'm looking for guidance on how to resolve this error or any workarounds that would allow my Jest tests to run without encountering this file system access issue. Has anyone faced a similar issue or can offer insights into what might be causing this and how to fix it?
0

There are 0 best solutions below