CODEWITHSUNDEEP
javascriptecmascript-6importvisual-studio-code
sanitizedUser
sanitizedUser

Reputation: 1907

How to import a file that already imports another file?

Javascript, ES6. I have three files:

inline-functions.js

\*
    Bunch of small functions.
*/

some-module.js

import './inline-functions.js'

// uses many inline functions

main.js

import './inline-functions.js'
import './some-module.js'

// uses inline functions as well as classes from some-module.js

Now, I use Visual Studio Code and I would like Intellisense working but when I am editing main.js, it only shows functions from inline-functions.js and everything from 'some-module.js' is unreachable even though there is an import statement. However, when I comment the import out of some-module.js like this:

// import './inline-functions.js'
// tries to use inline functions which are now not callable

Intellisense suddenly shows correct names and documentation for all objects. This is of course unusable because some-module.js now can't call any of the inline functions.

What is the correct way of importing these modules?

Upvotes: 1

Views: 624

Answers (1)

Sohail Ashraf
Sohail Ashraf

Reputation: 10569

You can access the module function only if you export it from the module.

Export the function form the module then you will see it in main js.

Example:

some-module.js

import './inline-functions.js'

const someFuncion1 = () =>  1;
const someFuncion2 = () => 2;

export {
    someFuncion1,
    someFuncion2
}

main.js

import * as inline './inline-functions.js'
import * as some './some-module.js'

//Access it like 

inline.<function name>
some.<function name>

Upvotes: 2

Related Questions