[@babel/plugin-transform-typescript] SyntaxError: Unknown PrivateName

[miqmago]

Bug Report

• I would like to work on a fix! -- But I don't even know where to start from...

Search terms
sharp field non-null assertion
declarative sharp
sharp non null

Current behavior

/repl.jsx: Unknown PrivateName "#field"
  3 | 
  4 |   myMethod() {
> 5 |     this.#field = new Date();
    |          ^^^^^^
  6 |     console.log(this.#field);
  7 |   }
  8 | }

• REPL

Input Code

class Demo {
  #field!: Date;

  myMethod() {
    this.#field = new Date();
    console.log(this.#field);
  }
}

const demo = new Demo();
demo.myMethod();

Expected behavior

tsc compiles fine, so I would expect that babel could translate the code to javascript too, but it fails.

Babel Configuration (babel.config.js, .babelrc, package.json#babel, cli command, .eslintrc)

• Filename: babel.config.js

module.exports = {
    plugins: [
        '@babel/plugin-transform-typescript',
        '@babel/plugin-proposal-class-properties',
        '@babel/plugin-proposal-json-strings',
        '@babel/plugin-proposal-object-rest-spread',
        ['transform-remove-console', { exclude: [ 'error', 'warn'] }],
        './babel-plugins/version.js'
    ],
    presets: [
        [
            '@babel/preset-env',
            {
                targets: {
                    browsers: ['> 0.25%, not dead']
                },
                modules: 'umd'
            }
        ]
    ],
    env: {
        development: {
        },
        prod: {
            presets: [
                ['minify', {
                    mangle: {
                        keepClassName: true
                    }
                }]
            ]
        },
        test: {
            plugins: [
                'istanbul'
            ]
        }
    },
    shouldPrintComment: (val) => /@license|@preserve|@version/i.test(val),
};

Environment

  System:
    OS: macOS 10.15.6
  Binaries:
    Node: 12.19.0 - ~/.nvm/versions/node/v12.19.0/bin/node
    npm: 6.14.8 - ~/.nvm/versions/node/v12.19.0/bin/npm
  npmPackages:
    @babel/cli: ^7.11.6 => 7.11.6 
    @babel/core: ^7.11.6 => 7.11.6 
    @babel/node: ^7.10.5 => 7.10.5 
    @babel/plugin-proposal-class-properties: ^7.10.4 => 7.10.4 
    @babel/plugin-proposal-json-strings: ^7.10.4 => 7.10.4 
    @babel/plugin-proposal-object-rest-spread: ^7.11.0 => 7.11.0 
    @babel/plugin-transform-modules-systemjs: ^7.10.5 => 7.10.5 
    @babel/plugin-transform-typescript: ^7.11.0 => 7.11.0 
    @babel/preset-env: ^7.11.5 => 7.11.5 
    babel-minify: ^0.5.1 => 0.5.1 
    babel-plugin-transform-remove-console: ^6.9.4 => 6.9.4 
    babel-preset-es2015: ^6.24.1 => 6.24.1 

[babel-bot]

Hey @miqmago! We really appreciate you taking the time to report an issue. The collaborators on this project attempt to help as many people as possible, but we're a limited number of volunteers, so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack community that typically always has someone willing to help. You can sign-up here for an invite."

[JLHwung]

Please ensure you are using Babel 7.12 and enable the allowDeclareFields option of transform-typescript, the error is thrown because the typescript-transform will remove the class field by default. The new behaviour is a breaking change thus we can not ship in minor releases.

['@babel/plugin-transform-typescript', { allowDeclareFields: true }]

Also, you can remove '@babel/plugin-proposal-object-rest-spread' and '@babel/plugin-proposal-json-strings', they are now included in @babel/preset-env, and will be activated only your targets requires them.

[miqmago]

@JLHwung thanks, I've just tried and it seems not to work.

Please note that this is a field with ! (exclamation mark) at the end, which indicates typescript that it can't be null. With only # (private) fields it works fine without the allowDeclareFields, and it does so with only ! (non-null) fields, but when combined both, it breaks.

[JLHwung]

Oh, I just realize that this issue has been fixed in #12149 but not yet released. It will be fixed in 7.12.0. allowDeclareFields: true is still required.

[JLHwung]

@miqmago Fixed in Babel 7.12.0.