导入CodeCompletionCore时报错：Class extends value undefined is not a constructor or null

问题场景 #

我在实现SQL自动补全功能时编写了如下代码：

import { InputStream, CommonTokenStream, Lexer, Token } from 'antlr4';
import antlr4 from 'antlr4';
import PrestoSqlLexer from '../lib/presto/PrestoSqlLexer';
import PrestoSqlParser from '../lib/presto/PrestoSqlParser';
import BaseParser from './common/baseParser';
import {CodeCompletionCore} from "antlr4-c3";


public suggest(sqlScript: string, atIndex?: number): AutocompleteOption[] {
    ...
    // core
    const core = new CodeCompletionCore(parser);
    // core.ignoredTokens = new Set([
    // ]);

    return [];
}

运行错误信息 #

运行时抛出如下错误：

TypeError: Class extends value undefined is not a constructor or null

       9 | } from './common/parserErrorListener';
      10 | import { AutocompleteOption } from './common/AutocompleteOption';
    > 11 | import { CodeCompletionCore } from 'antlr4-c3';
         | ^
      12 |
      13 | export default class PrestoSQL extends BaseParser {
      14 | public createLexer(input: string): antlr4.Lexer {

  at Object.<anonymous> (../../../../../../.yarn/cache/antlr4ts-npm-0.5.0-dev-7e0fc8988a-640dae2229.zip/node_modules/src/tree/xpath/XPathLexer.ts:18:33)
  at Object.<anonymous> (../../../../../../.yarn/cache/antlr4ts-npm-0.5.0-dev-7e0fc8988a-640dae2229.zip/node_modules/src/tree/xpath/XPath.ts:16:1)
  at Object.<anonymous> (../../../../../../.yarn/cache/antlr4ts-npm-0.5.0-dev-7e0fc8988a-640dae2229.zip/node_modules/src/tree/xpath/index.ts:6:1)
  at Object.<anonymous> (../../../../../../.yarn/cache/antlr4ts-npm-0.5.0-dev-7e0fc8988a-640dae2229.zip/node_modules/src/tree/index.ts:18:1)
  at Object.<anonymous> (../../../../../../.yarn/cache/antlr4ts-npm-0.5.0-dev-7e0fc8988a-640dae2229.zip/node_modules/src/index.ts:9:1)
  at Object.<anonymous> (../../../../../../.yarn/cache/antlr4-c3-npm-2.2.1-db3ae1db96-8dd44825f3.zip/node_modules/antlr4-c3/src/CodeCompletionCore.ts:10:1)
  at Object.<anonymous> (../../../../../../.yarn/cache/antlr4-c3-npm-2.2.1-db3ae1db96-8dd44825f3.zip/node_modules/antlr4-c3/index.ts:8:1)
  at Object.<anonymous> (src/parser/presto.ts:11:1)
  at Object.<anonymous> (src/parser/index.ts:3:1)
  at Object.<anonymous> (src/index.ts:1:1)

当前依赖版本 #

"dependencies": {
    "@types/antlr4": "4.7.0",
    "antlr4": "^4.9.3",
    "antlr4-c3": "^2.2.1",
    "antlr4ts": "^0.5.0-alpha.4",
  },

补充信息 #

错误指向antlr4ts的XPathLexer.ts和XPath.ts，但在该版本的GitHub源码中找不到XPathLexer.ts文件，不过本地node_modules里存在XPathLexer.d.js，怀疑是包安装问题，求排查错误原因。

排查思路与解决方案 #

1. 核心问题：两套ANTLR运行时冲突 #

你同时安装了antlr4（Java版ANTLR的JS运行时）和antlr4ts（ANTLR原生TypeScript运行时），这两个是完全独立的项目。antlr4-c3@2.2.1依赖的是antlr4ts，但你的代码中导入的是antlr4的模块，导致运行时依赖链混乱，出现继承未定义类的错误。

2. 预发布版本包存在缺陷 #

你安装的antlr4ts@0.5.0-alpha.4是预发布版本，可能存在打包不完整的问题——GitHub源码中没有XPathLexer.ts，但本地node_modules有对应的声明文件，说明包内容和源码不一致。

3. 具体解决步骤 #

• 移除冲突依赖：删除antlr4和@types/antlr4，不需要同时保留两套运行时：

  yarn remove antlr4 @types/antlr4
  

• 升级antlr4ts到稳定版：替换预发布版本为正式版0.5.0：

  yarn add antlr4ts@0.5.0
  

• 修正代码导入：将所有antlr4的导入替换为antlr4ts：

  // 替换前
  import { InputStream, CommonTokenStream, Lexer, Token } from 'antlr4';
  import antlr4 from 'antlr4';
  
  // 替换后
  import { InputStream, CommonTokenStream, Lexer, Token } from 'antlr4ts';
  import * as antlr4 from 'antlr4ts';
  

• 清理缓存重装：清理Yarn缓存并重新安装依赖：

  yarn cache clean
  yarn install
  

4. 验证包完整性 #

安装完成后，检查node_modules/antlr4ts/src/tree/xpath目录，确认XPathLexer.ts存在（稳定版0.5.0中该文件是存在的）。如果仍缺失，手动删除node_modules和yarn.lock后重新安装。

内容的提问来源于stack exchange，提问作者hehe123456