How to recover original code file parsed by React build?

Question

I'm working on React old projects and several of them have the native structure, like:

...{
    key: "render",
    value: function () {
      return React.createElement(
        "div",
        {
          className: "WrapperExamQuery",
          id: "IndexComponent",
        },
        React.createElement(
          "div",
          {
            className: "loadingWraper",
          },
          React.createElement(
            "div",
            {
              className: "teamLoading",
            },
            React.createElement("span", null, "loading... ")...

In my actual working team, nobody knows why is this, and don't find the orignal code (if exist). Is there a tool to parse o unparse these files to work with React jsx normally? any advise will be welcome. Thanks!

Answer 1

We ran into the same issue a long time ago. And then we tried this library. It's not maintained anymore but you can try

https://github.com/JoeStanton/babel-transform-js-to-jsx

I hope it help :)

Answer 2

If you built with default build script in react that build package includes the components files to so u can reach them by going browser's sources section. it may be different for your hosting provider. I use Netfily and I can get my project like that.

Answer 3

The accepted answer did not work for me. What did work, and luckily I had the website I made with the files up and running, is I ended up simply copying the files from chrome's devtools. I'm sure in Firefox it's the same.

Open devtools and in the "Sources" tab, you have all the files in their original state, which you can download individually.

Basically, the browser seems to decode the build folder and recreate your original folder.