Node.js - require is not defined javascript

This tutorial help to learn how you can fix JavaScript ReferenceError: require is not defined. The browser and Node.js environment.

When importing a module, JavaScript could occasionally provide you with the following error message: require is not defined.

The error:

Uncaught ReferenceError: require is not defined

What’s the use of require

The require() function is used when you need to load a package or a module into your JavaScript file.

Why This Error has happened

The most common reason for this is that the JavaScript environment cannot manage the call to the require() method that was specified in your code.

Some common causes for this Error in Server Side

using require() without RequireJS in a browser
Utilizing Node.js require() with the type: module specified in your package.json file
Your JavaScript file’s extension has a type error.

You can fix this issue in the client side(Browser) or the Server side, Let’s discuss it one by one :

Browser: How to Fix requirements is not defined in JS

Only the Node.js environment is loaded by default with the JavaScript require() function. So whenever you run the program code by using the browser.

The browser won’t be understood by the browser and throws an error. You can solve this problem that is using script tag.

A simple way to Load methods in the HTML file

We can normally load the method into an HTML file using a script tag. Let’s create a common.js file and define hello() method.

function hello() {
alert("Hello! js team");
}

We can call the hello() function after the script tag.

Sample Code

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
  </head>

  <body>
    <script src="common.js"></script>
	<script>
    hello();
  </script>
  </body>
</html>

You can access all method into you application.

How Solve in Modern Browser

Modern browsers like Chrome, Safari, and Firefox support import/export syntax inside a script with type module.

Create the common.js file and define a hello method. Finally, We have exported the function as follows:

function hello() {
  alert("Hello! js team");
}

export { hello };

Let’s import common.js file into our project file, the exported function will available in another file.

Create an HTML file and load the script with the type attribute as shown below:

Sample Html File

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
  </head>

  <body>
    <!-- define using type="module" attribute -->
    <script type="module" src="common.js"></script>
  </body>
</html>

How To call js method

we’ll import the method and call it.

import { hello } from "./common.js";

hello();

Let’s run the above file and You should see an alert box called from the above file.

How To use Require lib in Html

You can also use the require() function in a browser by including RequireJS libs in HTML file.

A module loader library for in-browser use is called RequireJS. You must download the most recent RequireJS release and place it in your scripts/ folder in order to add it to your project.

A unique attribute called data-main is utilized by RequireJS to load a certain script immediately after RequireJS has been loaded. In the aforementioned scenario, the scripts/app.js file will be loaded.

The fix require is not defined on server-side

Server-side environments like Node don’t have the script tag, so it needs the require() function.

Sample Example

//load library from node_modules
const lodash = require("axios");

//load your exported modules
const { hello } = require("./common");

How To Remove Nodejs type module

You may still see the require is not defined error because of your configurations. You need to remove type: module from your package.json file as shown below:

{
  "name": "app",
  "version": "1.0.0",
  "type": "module"
}

The module type is used to make Node treat .js files as ES modules.

Conclusion

We have learned the different ways of solutions to the ReferenceError: require is not defined issue from the server and browser environment. You can apply any one of the provided solutions.

Node.js – require is not defined javascript