Invalid Unicode escape \. when using named capture group

Question

In order to use named capture group on JavaScript, I did this modification:

diff --git a/assets/js/vue.js b/assets/js/vue.js
index f442939c9..6d9e707f0 100644
--- a/assets/js/vue.js
+++ b/assets/js/vue.js
@@ -44,7 +44,7 @@ Vue.config.silent = config.production;
 requireComponent.keys().forEach(fileName => {
   const
     componentConfig = requireComponent(fileName),
-    componentName = fileName.replace(/^(.*\/)?(.*)\.\w+$/u, '$2');
+    componentName = fileName.replace(/^(?<folder>.*\/)?(?<subfolder>.*)\.\w+$/u, '$<subfolder>');

   Vue.component(
     componentName,

But it does not compile anymore (using webpack):

 error  in ./assets/js/vue.js

Syntax Error: SyntaxError: invalid Unicode escape \.
    at Array.forEach (<anonymous>)

It compiles if I remove the \. from the end of the regexp, but this is required, normal and not modified at all.

I don't understand the relation with the named capture group replacement.

So my question is simple: What is the issue with this regexp?

Answer 1

Using the [] syntax fix the compilation error, it will check for the given char inside instead using the unicode escaping.

The following regex should work.

/^(?<folder>.*\/)?(?<subfolder>.*)[.]\w+$/u

But as Tyler Roper said, I think it a Webpack/Babel compilation error, the given regex should work.