[legacy-post-process] unknown: Unknown property: Ll

[tjk]

[legacy-post-process] unknown: Unknown property: Ll
error during build:
Error: unknown: Unknown property: Ll
    at matchProperty (/frontend/node_modules/@babel/standalone/babel.js:66815:11)
    at handleLoneUnicodePropertyNameOrValue (/frontend/node_modules/@babel/standalone/babel.js:66890:20)
    at getUnicodePropertyEscapeSet (/frontend/node_modules/@babel/standalone/babel.js:66900:13)
    at processTerm (/frontend/node_modules/@babel/standalone/babel.js:67044:24)
    at /frontend/node_modules/@babel/standalone/babel.js:67085:18
    at Array.map (<anonymous>)
    at processTerm (/frontend/node_modules/@babel/standalone/babel.js:67084:31)
    at /frontend/node_modules/@babel/standalone/babel.js:67085:18
    at Array.map (<anonymous>)
    at processTerm (/frontend/node_modules/@babel/standalone/babel.js:67084:31)
    at rewritePattern (/frontend/node_modules/@babel/standalone/babel.js:67175:5)
    at PluginPass.RegExpLiteral (/frontend/node_modules/@babel/standalone/babel.js:67305:26)
    at newFn (/frontend/node_modules/@babel/standalone/babel.js:47504:23)
    at NodePath._call (/frontend/node_modules/@babel/standalone/babel.js:45923:20)
    at NodePath.call (/frontend/node_modules/@babel/standalone/babel.js:45910:19)
    at NodePath.visit$1 [as visit] (/frontend/node_modules/@babel/standalone/babel.js:45958:33)

I'm trying to log out the code babel transform craps out on and noticed this (from monaco-editor dependency):

_modifyText(text, wordSeparators) {
  return (text
    .replace(/(\p{Ll})(\p{Lu})/gmu, '$1_$2')
    .replace(/([^\b_])(\p{Lu})(\p{Ll})/gmu, '$1_$2$3')
    .toLocaleLowerCase());

(essentially the code here: https://github.com/microsoft/vscode/blob/main/src/vs/editor/contrib/linesOperations/linesOperations.ts#L1058)

I looked in to https://babeljs.io/docs/en/babel-plugin-proposal-unicode-property-regex and tried to manually inject it into this plugin (I don't think there are hooks to configure babel standalone that is run?) but no success yet. ~Not sure if I'm doing it wrong or if this is a red herring... any guidance would be useful (even tips on debugging).~

UPDATE: Not a red herring! Deleting those two lines using \p regex in monaco-editor caused the build to succeed! Now would just love your help to understand the underlying issue and hopefully the fix. :)

PS: Thanks for this amazing software!

System Info

• vite version: 2.0.1
• Operating System: MacOS 11.1
• Node version: v12.18.1
• Package manager: npm

plugins: [
  vite:config     'alias',
  vite:config     'vite-plugin-gql', <--------------------------- CUSTOM
  vite:config     'vite-plugin-vue-svg', <--------------------------- CUSTOM
  vite:config     'vite:dynamic-import-polyfill',
  vite:config     'vite:resolve',
  vite:config     'vite:html',
  vite:config     'vite:css',
  vite:config     'vite:esbuild',
  vite:config     'vite:json',
  vite:config     'vite:wasm',
  vite:config     'vite:worker',
  vite:config     'vite:asset',
  vite:config     'vite-plugin-vue2', <--------------------------- CUSTOM
  vite:config     'vite-plugin-vue-md', <--------------------------- CUSTOM
  vite:config     'legacy-generate-polyfill-chunk',
  vite:config     'legacy-env',
  vite:config     'vite:define',
  vite:config     'vite:css-post',
  vite:config     'vite:build-html',
  vite:config     'commonjs',
  vite:config     'vite:data-uri',
  vite:config     'rollup-plugin-dynamic-import-variables',
  vite:config     'legacy-post-process',
  vite:config     'vite:import-analysis',
  vite:config     'vite:esbuild-transpile',
  vite:config     'vite:terser',
  vite:config     'vite:reporter'
  vite:config   ],

[mwwm1]

• [ ] - [****]()

[jonaskuske]

Yup, as soon as you use @babel/core and @babel/preset-env instead of @babel/standalone and its included env preset in the legacy plugin, the issue disappears. Not necessary to manually add the relevant Babel plugin. (not possible anyway as afaik those depend on @babel/core and aren't compatible with the standalone version)

[tjk]

Is there a quick workaround possible here? I imagine the more proper fix is to allow hooking into babel to add custom, required plugins? (and these would have to be written to be compatible with babel standalone?)

[jonaskuske]

If you just need a quick way to get it to work, try this:

npm i -D @babel/core @babel/preset-env module-alias

then add this to your package.json:

"_moduleAliases": {
  "@babel/standalone": "node_modules/@babel/core",
  "babel-preset-env": "node_modules/@babel/preset-env"
}

and in your vite.config.js add this as the very first line:

import 'module-alias/register'

Now when @vitejs/plugin-legacy requires Babel standalone, it'll actually get the full @babel/core because of the module alias :)

[tjk]

That worked! Thanks a bunch.

[jonaskuske]

This was fixed by Babel and released in version 7.13.0: https://github.com/babel/babel/blob/main/CHANGELOG.md#bug-bug-fix-5

[jonaskuske]

@tjk You can already remove the packages needed for the workaround, then just reinstall the dependencies and it'll work

(npm rm module-alias @babel/core @babel/preset-env && rm -rf node_modules && npm i)