JavaScript 开发新手必读：轻松解决 “Uncaught SyntaxError: Unexpected token ‘export’”

2023-05-17 23:16:14

避免“意外的“export”令牌”错误：全面指南

理解错误源头

当你遭遇“Uncaught SyntaxError: Unexpected token 'export'”错误时，这通常表明你使用了JavaScript模块系统，却未正确理解其使用方法。在模块系统中，“export”用于将变量、函数或类导出，以便其他模块可以导入并使用它们。如果你在未使用模块系统的情况下使用了“export”，就会触发此错误。

检查模块系统设置

要解决此错误，首先要确认你的代码是否采用了模块系统。JavaScript有两种主要模块系统：CommonJS和ES模块（又称ECMAScript模块）。确保你选择了正确的模块系统，并在代码中正确引入了必需的模块加载器。

导入必要的模块

在使用“export”关键字之前，你需要确保已导入必需的模块。如果要导出变量或函数，你需要使用“import”关键字导入它。如果要导出类，则需使用“export default”关键字将其导出。

避免在全局作用域中使用“export”

“export”关键字只能在模块内部使用。如果你在全局作用域中使用了“export”，就会引发“意外的“export”令牌”错误。请务必只在模块内部使用“export”关键字。

正确使用“export”

在使用“export”关键字时，需要注意以下几点：

“export”关键字必须放在变量、函数或类的前面。
“export”关键字只能在模块内部使用。
“export”关键字可以导出多个变量、函数或类。
“export default”关键字只能导出一个类。

代码示例

// 使用 CommonJS 模块系统
const myModule = require('./myModule.js');

// 导出变量
export const myVariable = 10;

// 导出函数
export function myFunction() {
  console.log('Hello world!');
}

// 导出类
export default class MyClass {
  constructor(name) {
    this.name = name;
  }
}

// 使用 ES 模块系统
import { myVariable, myFunction } from './myModule.js';

// 导出变量
export const myOtherVariable = 20;

// 导出函数
export function myOtherFunction() {
  console.log('Goodbye world!');
}