Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Es2018 Unicode Property Escapes Not working #19303

Open
shirazz opened this issue Nov 19, 2020 · 18 comments
Open

Es2018 Unicode Property Escapes Not working #19303

shirazz opened this issue Nov 19, 2020 · 18 comments
Labels
bug Issue was opened via the bug report template. good first issue Easy to fix issues, good for newcomers Webpack Related to Webpack with Next.js.

Comments

@shirazz
Copy link

shirazz commented Nov 19, 2020

Bug report

Describe the bug

Reproduction: codesandbox.io/s/muddy-cookies-9jr6z?file=/pages/index.js

After upgrading to V 10.0.2 the ES2018 Unicode Property Escapes feature is not working anymore. The same works perfectly till V 10.0.1 Not sure if it is due to the impact of #18759

Expected behavior

Since the upgrade is not a major one, expecting the feature to work with out any issues.

System information

  • OS: macOS,
  • Browser NA
  • Version of Next.js: [e.g. 10.0.2]
  • Version of Node.js: [e.g. 12.18.2]
@shirazz shirazz added the bug Issue was opened via the bug report template. label Nov 19, 2020
@timneutkens timneutkens added kind: bug and removed bug Issue was opened via the bug report template. labels Nov 22, 2020
@timneutkens timneutkens added this to the backlog milestone Nov 22, 2020
@timneutkens
Copy link
Member

Can you add a complete reproduction?

@timneutkens timneutkens added the good first issue Easy to fix issues, good for newcomers label Nov 22, 2020
@shirazz
Copy link
Author

shirazz commented Nov 23, 2020

@timneutkens Sorry for not including a reproduction demo. Please see it here https://codesandbox.io/s/muddy-cookies-9jr6z?file=/pages/index.js

@xxczaki
Copy link

xxczaki commented Nov 29, 2020

Current workaround:

  1. Install @babel/plugin-transform-unicode-regex:
$ npm install --save-dev @babel/plugin-transform-unicode-regex
  1. Place it in your Babel configuration
const presets = [
	'next/babel'
];

const plugins = [
    '@babel/plugin-transform-unicode-regex'
];

module.exports = {presets, plugins};

Might not be the best thing to do, but at least it fixes the issue 😄

cc @shirazz @timneutkens

@shirazz
Copy link
Author

shirazz commented Nov 30, 2020

Awesome!! Let's hope a proper fix lands on a future release. Haven't got time to check in detail

@Timer Timer modified the milestones: backlog, iteration 16 Jan 4, 2021
@timneutkens timneutkens modified the milestones: iteration 16, 10.x.x Jan 15, 2021
@shirazz
Copy link
Author

shirazz commented Mar 3, 2021

Was trying this last night and got an error like below. Adding @babel/core fixed the issue as well. @timneutkens is this an ideal way to fix this issue. Does adding @bable/core make any unexpected impacts. Adding codesandbox URL's for your reference as well.

image

Codesandbox URL with error.
Codesandbox URL with babel core added.

@nghiepdev
Copy link
Contributor

Same issue with [email protected] and Typescript.
Add @babel/plugin-transform-unicode-regex into .babelrc plugins has been resolved the issue.
Waiting for the next.js core fixing.

@jrosspaperless
Copy link

Still occurring as of [email protected]. Adding @babel/plugin-transform-unicode-regex resulted in e.charCodeAt is not a function when trying to compile decamelize.

@styfle styfle modified the milestones: 11.x.x, 12.0.4 Nov 5, 2021
@timneutkens timneutkens removed this from the 12.0.5 milestone Nov 17, 2021
@timneutkens timneutkens added the Webpack Related to Webpack with Next.js. label Nov 17, 2021
@ifeora-emeka
Copy link

Current workaround:

  1. Install @babel/plugin-transform-unicode-regex:
$ npm install --save-dev @babel/plugin-transform-unicode-regex
  1. Place it in your Babel configuration
const presets = [
	'next/babel'
];

const plugins = [
    '@babel/plugin-transform-unicode-regex'
];

module.exports = {presets, plugins};

Might not be the best thing to do, but at least it fixes the issue 😄

cc @shirazz @timneutkens

This worked for me. Thanks

@thomasyim-spendsy
Copy link

Current workaround:

  1. Install @babel/plugin-transform-unicode-regex:
$ npm install --save-dev @babel/plugin-transform-unicode-regex
  1. Place it in your Babel configuration
const presets = [
	'next/babel'
];

const plugins = [
    '@babel/plugin-transform-unicode-regex'
];

module.exports = {presets, plugins};

Might not be the best thing to do, but at least it fixes the issue 😄

cc @shirazz @timneutkens

This workaround works 👍 Subscribing this issue, waiting for official fixes.

@iamjoshua
Copy link

iamjoshua commented Feb 17, 2024

This is still an issue. Adding a custom babel config breaks builds in 14 as the current documentation doesn't explain how to extend babel config without overriding next's default settings.

@franher
Copy link

franher commented May 16, 2024

This bug is happening to us on Next.js 14.2.3. Any news on a fix? Could you help us applying the workaround? Is not clear enough how to apply it.

Thank you for your time.

@samuelkraft
Copy link

I just had this issue on Next.js 14.2.3 when using highlight.js and made it work by adding the package to transpilePackages in the next config.

const nextConfig = {
  transpilePackages: ["highlight.js"]
}

@chumaumenze
Copy link

I keep getting this regex error.

SyntaxError: Invalid regular expression: /0[oO](([0-7]_*)+)/mu: Invalid escape

Nextjs 14.2.4
highlight.js 11.9.0

@BretCameron
Copy link

I keep getting this regex error.

SyntaxError: Invalid regular expression: /0[oO](([0-7]_*)+)/mu: Invalid escape

Nextjs 14.2.4 highlight.js 11.9.0

I have this exact error as well.

@kasvith
Copy link

kasvith commented Jun 25, 2024

im having same issue with highlight.js

I keep getting this regex error.

SyntaxError: Invalid regular expression: /0[oO](([0-7]_*)+)/mu: Invalid escape

Nextjs 14.2.4 highlight.js 11.9.0

@kasvith
Copy link

kasvith commented Jun 25, 2024

I just had this issue on Next.js 14.2.3 when using highlight.js and made it work by adding the package to transpilePackages in the next config.

const nextConfig = {
  transpilePackages: ["highlight.js"]
}

this worked

@chumaumenze
Copy link

I just had this issue on Next.js 14.2.3 when using highlight.js and made it work by adding the package to transpilePackages in the next config.

const nextConfig = {

transpilePackages: ["highlight.js"]

}

this worked

I had tried this but it didn't work for static export.

@kasvith
Copy link

kasvith commented Jun 25, 2024

oh that can be the case, im not using static export

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Issue was opened via the bug report template. good first issue Easy to fix issues, good for newcomers Webpack Related to Webpack with Next.js.
Projects
None yet
Development

No branches or pull requests