In my factory function, I have the following setup:
import moduleA from'./modulea'
import moduleB from'./moduleb'
import { componentA, componentB } from './components'
module.exports = () => {
//DECLARE VARIABLES SHARED BY FUNCTIONS
const util = moduleA.util() //RETURNS OBJECT
return Object.assign({}, {
componentA,
componentB
}
}
Initially, componentA and componentB were functions within the factory function, allowing access to any imports or variables. However, since moving them to separate files in './components', I am facing issues with importing modules or declared variables into the components.
import moduleA from'./modulea'
import moduleB from'./moduleb'
module.exports = () => {
//DECLARE VARIABLES SHARED BY FUNCTIONS
const util = moduleA.util() //RETURNS OBJECT
const componentA = () => {
//MODULES AVAILABLE
//DECLARED VARIABLES AVAILABLE
//DO STUFF
}
const componentA = () => {
//MODULES AVAILABLE
//DECLARED VARIABLES AVAILABLE
//DO STUFF
}
return Object.assign({}, {
componentA,
componentB
}
}
The imported modules and declared variables are no longer accessible to the separate components despite using Object.assign. I have even attempted passing them into Object.assign without success.
Is there a way to make the imported modules and declared variables available to the imported components, so that I can divide the factory function into smaller components located in separate files, while maintaining accessibility without individual imports in each component file? My goal is to achieve this using closure.