CODEWITHSUNDEEP
javascriptnode.jsvue.jsecmascript-6
Yung Silva
Yung Silva

Reputation: 1500

How import something from index.js in the same directory?

I have the similar folder structure as shown below

/components/organisms
-- ModuleA.vue
-- ModuleB.vue
-- index.js

content of index.js

export { default as ModuleA } from "./ModuleA.vue"
export { default as ModuleB } from "./ModuleB.vue"

If I try to import ModuleB into ModuleA, it generates an error

ModuleA.vue content

<script>
import { ModuleZ } from '@/components/molecules' // component from another directory, it works perfectly
import { ModuleB } from '@/components/organisms' // can't find, error
</script>

Upvotes: 0

Views: 639

Answers (1)

Ferrybig
Ferrybig

Reputation: 18834

You cannot have an cyclic dependency structure with imports.

  • ModuleA requires index
  • index requires ModuleA

This generates undefined behaviour when bundled with webpack, usually manifesting as 1 of the files becoming undefined

Upvotes: 1

Related Questions