Webpack 4, babel 7, react, typescript: Unexpected token, expected "," Webpack 4, babel 7, react, typescript: Unexpected token, expected "," typescript typescript

Webpack 4, babel 7, react, typescript: Unexpected token, expected ","


Fixed by adding a babel preset: ['@babel/preset-typescript', {allowNamespaces: true}],

I have no clue why react breaks...


I faced the same issue. To fix this issue I have

  • to install @babel/preset-typescript by running

     yarn add @babel/preset-typescript
  • to add

     ['@babel/preset-typescript', {allowNamespaces: true}]

in webpack.config.js like this

rules: [        {            test: /\.[tj]sx?$/,            include: /(src)/,            use: [{                loader: 'babel-loader',                options: {                    presets: [                        [                            '@babel/preset-env',                            {                                "useBuiltIns": "usage",                                "corejs": 3                            }                        ],                        ['@babel/preset-typescript', { allowNamespaces: true }]                    ],                    plugins: [                        '@babel/plugin-syntax-dynamic-import'                    ]                }            }]        },        {            test: /\.tsx?$/,            include: path.resolve(__dirname, "src"),            use: [{                loader: 'ts-loader',                options: {                    transpileOnly: true                }            }]        },        {            test: /\.css$/,            use: ['style-loader', 'css-loader']        },        {            test: /\.(png|jpg|gif|svg|eot|ttf|woff|woff2)$/,            use: [{                loader: 'url-loader',                options: {                    limit: 10000,                }            }]        }    ]