TS 3.8.x ES private fields are not taken in account

[sionzee]

On Jan 10 was released typescript 3.8 beta. But we are not able to compile private fields from ecmascript.

Expected Behaviour

To compile code without issues

Actual Behaviour

Module parse failed: Unexpected character '#' (17:13)
File was processed with these loaders:
 * ./node_modules/ts-loader/index.js
You may need an additional loader to handle the result of these loaders.
|     constructor(properties) {
|         /** events */
>         this.#_onEnable = new SignalDispatcher();
|         this.#_onDisable = new SignalDispatcher();
|         this.#_onContentChange = new EventDispatcher();

Steps to Reproduce the Problem

Create project with TS 3.8 beta, use tslib from git and use ts-loader with webpack.
Create a class with EcmaScript private field.

Location of a Minimal Repository that Demonstrates the Issue.

Trivial to replicate, it is not needed.

packages:

"ts-loader": "^6.2.1",
"tslib": "https://github.com/microsoft/tslib",
"typescript": "^3.8.1-rc",
"webpack": "^4.41.5",
"webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.10.3"

tsconfig:

{
  "compilerOptions": {
    "outDir": "../build/ts",
    "sourceMap": true,
    "strict": true,
    "module": "ESNext",
    "moduleResolution": "node",
    "target": "ESNext",
    "skipLibCheck": true,
    "esModuleInterop": true,
    "experimentalDecorators": true,
    "suppressImplicitAnyIndexErrors": true,
    "importHelpers": true,
    "strictPropertyInitialization": false,
    "lib": ["DOM", "DOM.Iterable", "ESNext"],
  }
}

[johnnyreilly]

I suspect you're either not using the 3.8 version of TypeScript or something is awry with your configuration. I'm not aware of a need for any changes required to ts-loader to facilitate this.

[sionzee]

tsc is compiling the project without issues.

tested on:
tsc --project "../_config/tsconfig.json"
Which is the same project/same configuration

So I guess the issue is related to ts-loader.

Tried also
./node_modules/.bin/tsc --project _config/tsconfig.json
if it is not related to global tsc. Also works.

[sionzee]

// sorry for double post

I went to: node_modules/ts-loader/dist/index.js
put debugger at funcation:
function loader(contents) {

on:
const instanceOrError = instances_1.getTypeScriptInstance(options, this);
instanceOrError.instance.compiler.version === "3.8.1-rc"

compiler options:
{
  "outDir": "hidden/_v12/build/ts",
  "sourceMap": true,
  "strict": true,
  "module": 99,
  "moduleResolution": 2,
  "target": 99,
  "skipLibCheck": true,
  "esModuleInterop": true,
  "experimentalDecorators": true,
  "suppressImplicitAnyIndexErrors": true,
  "importHelpers": true,
  "strictPropertyInitialization": false,
  "lib": [
    "lib.dom.d.ts",
    "lib.dom.iterable.d.ts",
    "lib.esnext.d.ts"
  ],
  "baseUrl": "hidden/_v12",
  "configFilePath": "hidden/_v12/_config/tsconfig.json",
  "suppressOutputPathCheck": true
}

So it looks like the compiler is loaded correctly but error on output

[sionzee]

I found someone with the same issue:
webpack/webpack#10216

I also find out it comes from ACorn package. Where code 35 (#) is not handled and raises an error:
node_modules/acorn/dist/acorn.js, line: 4487
pp$9.getTokenFromCode = function(code) {

This function doesn't take in account 35.

So it seems to be Webpack issue

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[stale]

Closing as stale. Please reopen if you'd like to work on this further.