Ошибка ReferenceError: require is not defined в JS

Ошибка “ReferenceError: require is not defined” возникает, когда функция require используется в файле JavaScript, который предназначен для выполнения в браузере, а не в среде Node.js.

Таким образом, в данном случае ошибка возникает, если вы попытаетесь использовать функцию require в файле, предназначенном для выполнения в браузере.

Кратко: функция require – это глобальная функция, предоставляемая средой выполнения Node.js. Она используется для загрузки и выполнения модулей в приложении Node.js. Однако функция require недоступна в браузерах, поскольку браузеры не поддерживают систему модулей Node.js.

Чтобы исправить эту ошибку, вам нужно удалить все ссылки на функцию require из вашего кода.

// This code will throw a "ReferenceError: require is not defined" error
const myModule = require('./my-module');

// To fix the error, remove the require function and use a different approach to load the module
import myModule from './my-module';

В этом примере функция require используется для загрузки модуля Node.js из файла. Однако, поскольку этот код предназначен для выполнения в браузере, функция require не определена и вызовет ошибку “ReferenceError: require is not defined”.

Вместо этого вы можете удалить функцию require и использовать синтаксис import для загрузки модуля.

Браузер

Чтобы использовать модули ES6 непосредственно в браузере, необходимо установить атрибут type="module":

<script type="module" src="./my-module.js"></script>
<script type="module" src="./my-script.js"></script>

Node.js

Один из способов исправить эту ошибку – убедиться, что ваш код выполняется в среде Node.js.

node my-script.js

Так функция require будет доступна вашему коду.

В качестве альтернативы вы можете использовать синтаксис импорта и экспорта модулей ES6, а не функцию require. Это позволит вашему коду выполняться как в Node.js, так и в браузерах, без использования функции require.

// my-module.js

export const myFunction = () => {
  // Function body
};

// my-script.js

import { myFunction } from './my-module.js';

myFunction();

Вы также можете сослаться на него в файле package.json:

{
  "name": "example",
  "type": "module",
  ...
}

Экспорт по умолчанию

Вот пример того, как можно определить функцию и переменную, экспортировать функцию как экспорт по умолчанию, а переменную как именованный экспорт, используя синтаксис модуля ES6:

// my-module.js

const myVariable = 'Hello, world!';

const myFunction = () => {
  console.log(myVariable);
};

export default myFunction;

export { myVariable };

Вот пример того, как вы можете импортировать экспорт по умолчанию и именованный экспорт из файла my-module.js:

// my-script.js

import myFunction, { myVariable } from './my-module.js';

myFunction();

console.log(myVariable);

Несколько моментов, о которых следует помнить:

• Вы можете использовать ключевое слово export default только один раз в модуле. Это означает, что в каждом файле может быть только один экспорт по умолчанию. Если вы попытаетесь использовать ключевое слово более одного раза в одном и том же модуле, вы получите ошибку.
• При использовании синтаксиса модуля ES6 для импорта модуля необходимо указать расширение файла модуля. Это связано с тем, что интерпретатор JavaScript должен знать тип импортируемого файла, чтобы правильно его обработать.
• Хотя функция require() и синтаксис импорта и экспорта модулей ES6 являются способами организации и управления модулями, они не совместимы друг с другом. Это означает, что вы не можете смешивать и сочетать функцию require() и синтаксис модуля ES6 в одном и том же модуле.

Если у вас появились вопросы по поводу ошибки “ReferenceError: require is not defined” в JS, мы будем рады ответить вам в комментариях ниже.