I have this folder structure:
Parent /
Child-A /
src /
modules /
Module-A.js
Module-B.js
Module-C.js
Module-D.js
Main-A.js
Child-B /
src /
Main-B.js
I want to import ModuleA.js in MainB.js. Please note that ModuleA.js has no exports, if that even means something (I'm new to ES6). It looks something like this:
import { showNotification } from './Notification';
$( document ).on( 'click', '[data-action="load-more"]', ajaxCall );
function ajaxCall() {
...
}
function addNewPosts() {
...
}
function notifyError() {
...
}
I tried importing the module adding this line of code in Main-B.js:
import '../../Child-A/src/modules/Module-A.js'
But for some reason this imports the whole Main-A.js, not just Module-A.js
Any ideas?
+++ UPDATE +++
To elaborate a bit more, here's the Main-A.js code, which imports all the modules in the Child-A project:
// Stylesheets
import './style.scss';
// Libraries
import 'salvattore';
import 'jquery-lazy';
// Custom Scripts
import './modules/Module-A';
import './modules/Module-B';
import './modules/Module-C';
import './modules/Module-D';
And here's the Main-B.js file from the Child-B project:
// Stylesheets
import './style.scss';
// Libraries
import 'salvattore';
// Custom Scripts
import '../../Child-A/src/modules/Module-A.js';
Like I said, in this Main-B.js file I only want to import Module-A; but doing it as I did results in all the modules from the Child-A project to be imported, which I know because the functions in the other modules are working in the Child-B project as well, even though I'm not explicitly importing them, and I can't understand why they're working.
I am using a module bundler (Webpack) for each project.