[Bug]: typeof this.foo throws Unexpected keyword 'this'. #14357
Description
💻
- Would you like to work on a fix?
How are you using Babel?
babel-loader (webpack)
Input code
class Foo {
private bar: number = 1;
public baz(arg: typeof this.bar) {
}
}Configuration file name
babel.config.json, babel.config.js
Configuration
module.exports = function (api) {
api.cache(true);
const config = {
sourceType: 'unambiguous',
presets: [
[
'@babel/preset-env',
{
// modules: 'commonjs',
// targets: {
// node: '12.8',
// chrome: '78',
// // esmodules: true,
// },
// loose: true,
useBuiltIns: 'entry', // 'usage',
corejs: '3.21',
},
],
[
'@babel/preset-react',
{
development: process.env.NODE_ENV === 'development',
},
],
// https://www.npmjs.com/package/babel-preset-react-app
// ['react-app', { flow: false, typescript: true }],
[
'@babel/preset-typescript',
// https://babeljs.io/docs/en/next/babel-preset-typescript
{
isTSX: true,
allExtensions: true,
allowNamespaces: true,
allowDeclareFields: true,
onlyRemoveTypeImports: true,
// jsxPragma: 'React',
},
],
],
// https://babeljs.io/docs/en/assumptions
assumptions: {
constantReexports: true,
constantSuper: true,
enumerableModuleMeta: true,
ignoreFunctionLength: true,
ignoreToPrimitiveHint: true,
mutableTemplateObject: true,
noClassCalls: true,
noDocumentAll: true,
noIncompleteNsImportDetection: true,
noNewArrows: true,
objectRestNoSymbols: true,
privateFieldsAsProperties: true,
setClassMethods: true,
setComputedProperties: true,
setPublicClassFields: true,
setSpreadProperties: true,
skipForOfIteratorClosing: true,
superIsCallableConstructor: true,
},
plugins: [
'@babel/plugin-syntax-dynamic-import',
// [
// '@babel/plugin-transform-modules-commonjs',
// {
// noInterop: true,
// loose: true,
// },
// ],
[
'named-asset-import',
{
loaderMap: {
// svg: {
// ReactComponent: '@svgr/webpack?-svgo,+titleProp,+ref![path]',
// },
},
},
],
// ['@babel/plugin-transform-runtime', { helpers: false, useESModules: true }],
// ['import', { libraryName: 'antd', libraryDirectory: 'es', style: true }], // babel-plugin-import
],
compact: false,
// sourceMaps: true,
};
// if (process.env.NODE_ENV === 'development') {
// config.plugins.push('@babel/plugin-transform-react-jsx-source');
// }
return config;
};Current and expected behavior
Current: Unexpected keyword 'this'. (4:25)
Expected: no error
Environment
System:
OS: macOS 12.2.1
Binaries:
Node: 16.14.0 - ~/.nvm/versions/node/v16.14.0/bin/node
Yarn: 1.22.17 - ~/.nvm/versions/node/v16.14.0/bin/yarn
npm: 8.4.1 - ~/.nvm/versions/node/v16.14.0/bin/npm
npmPackages:
@babel/core: ^7.17.7 => 7.17.7
@babel/plugin-transform-react-jsx-source: ^7.16.7 => 7.16.7
@babel/preset-env: ^7.16.11 => 7.16.11
@babel/preset-react: ^7.16.7 => 7.16.7
@babel/preset-typescript: ^7.16.7 => 7.16.7
babel-jest: ^27.5.1 => 27.5.1
babel-loader: ^8.2.3 => 8.2.3
babel-plugin-add-module-exports: ^1.0.4 => 1.0.4
babel-plugin-named-asset-import: ^0.3.8 => 0.3.8
babel-preset-react-app: ^10.0.1 => 10.0.1
eslint: ^8.11.0 => 8.11.0
jest: ^27.5.1 => 27.5.1
webpack: ^5.70.0 => 5.70.0
Possible solution
I use yarn
"resolutions": {
"@babel/parser": "7.17.3"
},Additional context
Works on "@babel/parser": "7.17.3"
Fails on "@babel/parser": "7.17.7"