wix-incubator / vscode-glean

The extension provides refactoring tools for your React codebase

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Configuration contains string/RegExp pattern, but no filename was passed to Babel

andreyvital opened this issue · comments

I'm getting this error when trying to extract to a file (and even just a component within the file):

[BABEL] unknown: Configuration contains string/RegExp pattern, but no filename was passed to Babel

<svg viewBox="0 0 64 64" width={22} height={22}>
  <path d="M1.652 19.564h17V62h-17zM44.862 19.564H62V62H44.862z" fill="#5aaae0" />
  <path d="M18.652 2h26.21v60h-26.21z" fill="#7dc7ff" />
  <path
    d="M33.912 48.566a3.923 3.923 0 0 0 1.894-3.343 4 4 0 0 0-8 0 3.923 3.923 0 0 0 1.893 3.343 5.922 5.922 0 0 0-3.893 5.539V62h12v-7.895a5.922 5.922 0 0 0-3.894-5.539z"
    fill="#f73445"
  />
  <g fill="#359ed8">
    <path d="M22.684 23.512H24.7v1.973h-2.016zM22.684 27.46H24.7v1.973h-2.016zM22.684 31.407H24.7v1.973h-2.016zM22.684 35.354H24.7v1.974h-2.016zM26.717 23.512h2.016v1.973h-2.016zM26.717 27.46h2.016v1.973h-2.016zM26.717 31.407h2.016v1.973h-2.016zM26.717 35.354h2.016v1.974h-2.016zM30.749 23.512h2.016v1.973H30.75zM30.749 27.46h2.016v1.973H30.75zM30.749 31.407h2.016v1.973H30.75zM30.749 35.354h2.016v1.974H30.75zM34.781 23.512h2.017v1.973H34.78zM26.717 19.564h2.016v1.974h-2.016zM30.749 19.564h2.016v1.974H30.75zM34.781 19.564h2.017v1.974H34.78zM34.781 27.46h2.017v1.973H34.78zM34.781 31.407h2.017v1.973H34.78zM34.781 35.354h2.017v1.974H34.78zM38.814 23.512h2.016v1.973h-2.016zM38.814 27.46h2.016v1.973h-2.016zM38.814 31.407h2.016v1.973h-2.016zM38.814 35.354h2.016v1.974h-2.016z" />
  </g>
  <path
    d="M13.47 52.485a2.93 2.93 0 0 0 1.166-2.328 3 3 0 0 0-6 0A2.93 2.93 0 0 0 9.8 52.485a4.93 4.93 0 0 0-3.165 4.58V62h10v-4.934a4.93 4.93 0 0 0-3.166-4.581z"
    fill="#f7f769"
  />
  <path
    d="M22.543 49.524a2.93 2.93 0 0 0 1.165-2.327 3 3 0 0 0-6 0 2.93 2.93 0 0 0 1.166 2.327 4.93 4.93 0 0 0-3.166 4.581V62h10v-7.895a4.93 4.93 0 0 0-3.165-4.581z"
    fill="#ffc943"
  />
  <path
    d="M53.794 52.485a2.93 2.93 0 0 0 1.166-2.328 3 3 0 0 0-6 0 2.93 2.93 0 0 0 1.165 2.328 4.93 4.93 0 0 0-3.166 4.58V62h10v-4.934a4.93 4.93 0 0 0-3.165-4.581z"
    fill="#f7f769"
  />
  <path
    d="M44.72 49.524a2.93 2.93 0 0 0 1.167-2.327 3 3 0 0 0-6 0 2.93 2.93 0 0 0 1.165 2.327 4.93 4.93 0 0 0-3.165 4.581V62h10v-7.895a4.93 4.93 0 0 0-3.166-4.581z"
    fill="#ffc943"
  />
  <path
    d="M49.903 26.472h2.016v15.79h-2.016zM55.951 26.472h2.017v15.79H55.95zM5.546 26.472h2.017v15.79H5.546zM11.595 26.472h2.016v15.79h-2.016z"
    fill="#005889"
  />
  <path d="M23.692 4.76h16.13v9.87h-16.13z" fill="#359ed8" />
</svg>

That's the code block I'm trying to extract 👆

Hi @andreyvital ! Interesting use case! Currently im off for the weekend. Ill have a look at it ASAP!

Hey @andreyvital , I was unable to reproduce the issue.I succesfully managed to extract the svg snippet into its own component. Perhaps I misunderstood the issue?
Here is the test case:
image

Also seeing the above error message in VSCode when using 'Extract Component' and typing in a filename [e.g. nestedComponent.jsx].

Occurs in minimal example:

import React, { Component } from 'react'

class MyComponent extends Component {
  render() {
    return (
      <div>
        Hello
        <div>Nested</div>
      </div>
    )
  }
}

I am also seeing this error when trying to extract a component in TSX

[BABEL] unknown: Configuration contains string/RegExp pattern, but no filename was passed to Babel

Thanks guys! Will have a look!

@borislit Any updates? Does this project depend on Babel being installed or could it be conflicting with my local version of babel?

Hi @southpolesteve. Had hard time finding time recently, but Im on it :)
In terms of babel - since the extension is not installed into your project's node_module - there should be no conflicts.
Which component have you tried to extract? Can you provide a code snippet that reproduced the issue?

I would love to use glean but this problem is blocking me as well. Tried uninstalling and reinstalling glean to no avail

hi all ,
I think the problem was caused by extension name of babel configuration ,
there seems like glean only expected an json format babel configuration .
if your configuration format is .js , please try to change to .json ( ex. babel.config.json )
this is work for me .
cc @TSMMark @borislit @southpolesteve @andreyvital