Skip to content

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

'vue-demi' causes errors when importing into Vitest test (only the .mjs file breaks it) #1521

Closed
dmix opened this issue Aug 4, 2022 · 0 comments

Comments

@dmix
Copy link

dmix commented Aug 4, 2022

Describe the bug

I get this error whenever I import a Pinia store into my test:

SyntaxError: The requested module 'vue-demi' does not provide an export named 'computed'
 ❯ ../../async /Users/dmix/dev/callpixels/app/javascript/__tests__/stores/target_options_test.ts:1:256

Also got a more detailed version with some tweaks:

SyntaxError: Named export 'computed' not found. The requested module 'vue-demi' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'vue-demi';
const { getCurrentInstance, inject, toRaw, watch, unref, markRaw, effectScope, ref, isVue2, isRef, isReactive, set, onUnmounted, reactive, toRef, del, nextTick, computed, toRefs } = pkg;

 ❯ ../../async /Users/dmix/dev/callpixels/app/javascript/__tests__/stores/target_options_test.ts:1:256

This is the code in the test file (removing pinia stuff resolves the error)

import { setActivePinia, createPinia } from 'pinia'
import {
    useTargetOptionStore,
    TargetOptionState,
} from '../../stores/target_options'

describe('TargetOption Store', function() {
    beforeEach(() => {
        setActivePinia(createPinia())
        store = useTargetOptionStore()
    })
    ...

This is not a new issue, others have managed to solve it by explicitly adding .mjs settings to webpack or nuxt config:

vueuse/vueuse#718 (comment)

The problem is that I'm using Vite and not webpack, so I dont know how to apply a similar config setting.

I resolved the issue by simply deleting the .mjs file rm ./node_modules/pinia/dist/pinia.mjs, this is fine because there's also the exact same .js version of this file that DOES import properly

Is there a way to fix this mjs issue?

Reproduction

My full vite.config.ts file:

https://gist.github.com/dmix/780c81495d3fdfdf140e7cbe1e95e4c0

Expected behavior

The pinia.mjs file should be imported properly allowing the tests to run

Actual behavior

Error message whenever running yarn run vitest run

Additional information

No response

@vuejs vuejs locked and limited conversation to collaborators Aug 4, 2022
@posva posva converted this issue into discussion #1525 Aug 4, 2022

This issue was moved to a discussion.

You can continue the conversation there. Go to discussion →

Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant