Error when import then build

[dohoangtung]

Plugin version

From v21.x.x => v23.1.0

Steps to reproduce

1. import intlTelInput from "intl-tel-input";
2. yarn build

Got the error:

ERROR in ./node_modules/intl-tel-input/build/js/intlTelInput.js 1513:6
Module parse failed: Unexpected token (1513:6)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| var Iti = class {
| //* Can't be private as it's called from intlTelInput convenience wrapper.

id;

| //* NOT Private
| promise;
@ ./src/form-elements/TelInput/index.js 4:0-42
@ ./src/form-elements/index.jsx
@ ./src/form.jsx
@ ./src/index.jsx

Downgrade to version v20.x.x or v19.x.x => Build OK

[jackocnr]

What does yarn build do? Please give as much detail as possible - what your build system is, which version, include config files etc.

But from the error message, it appears to be struggling with the syntax on this line which uses class fields.

So I guess your build system is not setup for that syntax. The error message suggests you might need to use an appropriate loader to handle this syntax?

[dohoangtung]

Hi,

thanks for quick response

My env:

Nodejs v18
"@babel/cli": "^7.12.10",
"@babel/core": "^7.12.10",
...
"webpack": "^4.46.0",

Yarn build will execute webpack with babel

Update webpack to latest version fix the issue!