Uncaught TypeError: Cannot read properties of undefined (reading 'custom') at node_modules/antlr4ts/misc/BitSet.js (BitSet.ts:834:32)

[sailei1]

node.js :19.5.0

{
  "name": "test",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "dev": "vite",
    "build": "run-p type-check build-only",
    "preview": "vite preview",
    "build-only": "vite build",
    "type-check": "vue-tsc --noEmit",
    "grammar:build": "antlr4ts -visitor \"./src/grammar/if.g4\" -o \"./\""
  },
  "dependencies": {
    "@codemirror/autocomplete": "6.1.0",
    "@codemirror/commands": "6.0.1",
    "@codemirror/language": "6.2.1",
    "@codemirror/search": "6.0.1",
    "@codemirror/state": "6.1.1",
    "@codemirror/view": "6.2.0",
    "@lezer/generator": "1.1.1",
    "@lezer/highlight": "1.0.0",
    "antlr4": "^4.12.0-beta.4",
    "antlr4ts": "^0.5.0-alpha.4",
    "pinia": "^2.0.28",
    "vue": "^3.2.45",
    "vue-router": "^4.1.6"
  },
  "devDependencies": {
    "@types/node": "^18.11.12",
    "@vitejs/plugin-vue": "^4.0.0",
    "@vue/tsconfig": "^0.1.3",
    "antlr4ts-cli": "^0.5.0-alpha.4",
    "npm-run-all": "^4.1.5",
    "typescript": "~4.7.4",
    "vite": "^4.0.0",
    "vue-tsc": "^1.0.12"
  }
}

[sailei1]

[zuiidea]

Webpack 5 no longer polyfills Node.js core modules automatically, Add the following configuration to Webpack(Reference details):

module.exports = {
  //...
  resolve: {
    fallback: {
      assert: require.resolve("assert"),
      url: require.resolve("url"),
    },
  },
};

[HanXing1694]

你好，请问这个问题解决了么？我这边也碰到了相同的问题。

[irgijs]

你好，请问这个问题解决了么？我这边也碰到了相同的问题。

This is still a problem. The antlr4ts library depends on the process and util packages (only for debugging or profiling purposes). Since these packages are unavailable in the browser, they must be polyfilled. For those using vite, this package helps: https://www.npmjs.com/package/vite-plugin-node-polyfills

[martinmolema]

Been trying to get this to work with Angular 17. So I installed the package @irgijs suggested. But I do not understand how to get Angular 17 to understand this. Where should I at a reference to 'util' or 'process' package?

There is no webpack config file anymore in Angular 17....

Tried to add this to several files (like app.config.ts and main.ts.

(window as any).process = {
  env: { DEBUG: undefined },
};

Any help is greatly appreciated. I finally got rid of a gazillion compiler errors when moving from Angular 13 to 17. And now during runtime this error shows up :(.

util.js:109 Uncaught ReferenceError: process is not defined
    at node_modules/util/util.js (util.js:109:1)
    at __require2 (chunk-723JPBGU.js?v=1f8d2492:46:50)
    at node_modules/assert/build/internal/assert/assertion_error.js (assertion_error.js:25:16)
    at __require2 (chunk-723JPBGU.js?v=1f8d2492:46:50)
    at node_modules/assert/build/assert.js (assert.js:39:22)
    at __require2 (chunk-723JPBGU.js?v=1f8d2492:46:50)
    at node_modules/antlr4ts/misc/Array2DHashSet.js (Array2DHashSet.js:18:16)
    at __require2 (chunk-723JPBGU.js?v=1f8d2492:46:50)
    at node_modules/antlr4ts/misc/Array2DHashMap.js (Array2DHashMap.js:8:26)
    at __require2 (chunk-723JPBGU.js?v=1f8d2492:46:50)


[martinmolema]

Ok, answering my own question for those running into this problem.

What I didn´t have to do:

• install the above mentioned vite-polyfill
• install browserify

I had to make the following changes

file: {projectroot}/tsconfig.app.json

• add "node" to the compilerOptions->types array

so this is my current file:

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "./out-tsc/app",
    "types": [
      "@angular/localize","node"
    ]
  },
  "files": [
    "src/main.ts"
  ],
  "include": [
    "src/**/*.d.ts"
  ]
}

• install the "@types/node" (for dev: npm i --save-dev @types/node)

Then make sure to restart your ng serve in order to make sure the changes will be seen and used

Happy coding!

[irgijs]

@martinmolema eventually I switched to the "antlr4" package since it now natively supports typescript as a target.