All my experience with exporting/importing modules has come in ES6 using export
and import
, where you can do something like this to have a single module export a default function as well as separate named functions.
// module.js export default mainFunction export { namedFunction } // main.js import mainFunction from 'functions' mainFunction() import { namedFunction } from 'function' namedFunction()
However I can't figure out how to do this with ES5 style imports using module.exports
and require
. As far as I understand, I can export either a single default:
// module.js module.exports = function mainFunction() {} // main.js const mainFunction = require('module.js')
Or I can create named exports:
// module.js module.exports = { namedFunction: function() {} } // main.js const namedFunction = require('module.js').namedFunction
But I can't do both. I thought I could maybe name one of the exports "default" like this, but it doesn't work
// module.js module.exports = { default: function() {}, namedFunction: function() {} } // main.js const mainFunction = require('module.js') // does not work const mainFunction = require('module.js').default // works, but not what I want const namedFunction = require('module.js').namedFunction
How can I accomplish this dual default/named export with ES5?
Exports without a default tag are Named exports. Exports with the default tag are Default exports. Using one over the other can have effects on your code readability, file structure, and component organization. Named and Default exports are not React-centric ideas. They are es6 features.
Export Default is used to export only one value from a file which can be a class, function, or object. The default export can be imported with any name.
exports being the exported component of any types - object, function, string, and so on. Default exporting in a Node. js module is as simple as this: module.
The error "The requested module does not provide an export named 'default'" occurs when we try to import a value or a function from a file using a default import, but the value is not exported from the file with a default export. Copied! And this is a file that imports the function from index.
You want to assign the value of module.exports
to be your default function, and then put all the named exports as properties on that function.
const defaultFunction = () => { console.log('default!'); }; const namedFunction1 = () => { console.log('1!'); }; const namedFunction2 = () => { console.log('2!'); }; const myModule = module.exports = defaultFunction; myModule.namedFunction1 = namedFunction1; myModule.namedFunction2 = namedFunction2;
Let's say that was in myModule.js
. Then you can do this:
const myModule = require('./myModule'); myModule(); // Prints: 'default!' myModule.namedFunction1(); // Prints: '1!'
Just re-assign exports
to module.exports
Like:
//name.js const NameType = { foo: "bar", }; function Name(name) { this.name = name; } module.exports = Name; // assign default export to Name exports = module.exports; // re-assign exports to point it to the updated location. exports.NameType = NameType; // now you can use named export as usual
In another file you can import like:
const Name = require("./name"); const { NameType } = require("./name");
This works because by default module = { exports: {} }
and exports = module.exports
Reference: Difference between "module.exports" and "exports" in the CommonJs Module System
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With