t ReferenceError: require is not defined
时间: 2025-07-15 19:59:52 AIGC 浏览: 23
JavaScript 中出现 `ReferenceError: require is not defined` 错误通常发生在浏览器环境中尝试使用 Node.js 的 CommonJS 模块系统时。`require()` 是 Node.js 用于加载模块的函数,在浏览器中默认不可用,除非通过打包工具(如 Webpack、Browserify)进行处理。
### 常见原因及解决方案
#### 1. 在浏览器中直接使用 `require()`
浏览器不支持 CommonJS 的 `require()` 方法。如果在 HTML 文件中直接引入 `.js` 文件并尝试使用 `require()`,将导致此错误。
```html
<script src="app.js"></script>
```
其中 `app.js` 包含:
```javascript
const fs = require('fs');
```
这会导致 `ReferenceError`,因为浏览器无法识别 `require()`[^1]。
**解决方法:**
- 使用模块打包工具(如 Webpack 或 Browserify),将使用 `require()` 的代码打包为一个可在浏览器运行的文件。
- 改用 ES6 的 `import` 语法,这是浏览器原生支持的模块系统(需启用 `type="module"`):
```html
<script type="module" src="app.js"></script>
```
并在 `app.js` 中使用:
```javascript
import fs from 'fs';
```
注意:Node.js 需要启用 ESM 支持,且部分内置模块(如 `fs`)不能在浏览器中使用[^4]。
#### 2. 在 ES 模块(ESM)中使用 `require()`
在使用 `import` 和 `export` 的 ES 模块中,`require()` 不被支持。如果尝试混合使用两者,将导致错误。
**解决方法:**
- 统一使用 `import`/`export` 语法来管理模块。
- 如果必须使用 `require()`,则应将其限制在 CommonJS 环境中运行(如 Node.js 脚本)。
#### 3. Node.js 项目未正确配置模块系统
在 Node.js 项目中,若 `package.json` 中未指定 `"type": "module"`,默认使用 CommonJS;反之,若设为 `"type": "module"`,则默认使用 ESM,此时 `require()` 将不可用(除非使用兼容性工具)。
**解决方法:**
- 若希望继续使用 `require()`,请确保 `package.json` 中没有 `"type": "module"`。
- 若使用 ESM 并需要引入 CommonJS 模块,可通过动态导入方式:
```javascript
const fs = require('fs'); // 在 ESM 中会报错
// 替代方案
const { createRequire } = require('module');
const require = createRequire(import.meta.url);
const fs = require('fs');
```
#### 4. 使用前端框架或构建工具时配置不当
某些前端构建工具(如 Vite、Webpack)在处理模块时可能因配置问题导致 `require()` 未定义。
**解决方法:**
- 确保构建工具配置正确,允许使用 CommonJS 或自动转换模块语法。
- 对于 Vue 或 React 等项目,建议遵循官方推荐做法,使用 `import` 引入组件和库[^3]。
阅读全文
相关推荐

















