What is the difference between .js and .mjs files?

I have started working on an existing project based on Node.js. I was just trying to understand the flow of execution, where I encountered with some *.mjs files. I have searched the web where I found that these are module based JS-files.

I want to know how is it different from *.js files (how does it benefit)?

Solution 1:

It indicates an ES6 module file.

Node.js's original module system is CommonJs (which uses require and module.exports).

Since Node.js was created, the ECMAScript module system (which uses import and export) has become standard and Node.js has added support for it.

Node.js will treat .cjs files as CommonJS modules and .mjs files as ECMAScript modules. It will treat .js files as whatever the default module system for the project is (which is CommonJS unless package.json says "type": "module",).

See also: Differences between ES6 module system and CommonJs

Solution 2:

.MJS file

• mjs an extension for EcmaScript modules
• An MJS file is a source code file containing an ES Module (ECMAScript Module) for use with a Node.js application.

• MJS files are written in JavaScript, and may also use the .JS extension outside of the Node.js context.

• ES Modules allow web and application developers to organize code into smaller reusable components.

ECMAScript 6 (ES6) introduced the specification for ES Modules, providing a standard for implementing modules in JavaScript. As of 2018, all major web browsers support ES Modules.

However, the popularity of modularized JavaScript pre-dates ES6. Node.js, a JavaScript runtime environment, used CommonJS as the specification for modules. Because so many existing applications were built with CommonJS, when Node.js added support for native ES modules, it controversially introduced the MJS file extension to differentiate the two and prevent applications from breaking.

NOTE: Some developers informally refer to MJS files as "Michael Jackson Script" files.

Solution 3:

For clarity. As for devs/humans, it's easy to distinguish between a module file(.mjs) and a normal javascript file(.js)... because it's not always easy to determine even if you examine the code in the file.

There are also performance benefits which gives you more reason to consider using it. V8(JavaScript engine that powers Google Chrome) recommends the use of .mjs but it still depends on your situation. If you want to know more of it's advantages, check https://v8.dev/features/modules#mjs