javascript - Can I use a sourcemap and bundle file to retrieve original react code - Stack Overflow

admin管理员组

文章数量:1296885

I have these two files on my server:

/react/build/static/js/stats.js

and

/react/build/static/js/main.5c7483.js

In the stats.js file, it has this line at the bottom:

//# sourceMappingURL=main.8c33616f.js.map (I noticed the filename does not match)

The react app works fine, but I want to make some small changes. However, the developer has told me they pletely lost the original source files due to a hard drive failure.

Is it possible to recover source files (or even anything that resembles source code?) I found this debundle package but couldn't get the configuration to work properly.

They told me the project was created using create-react-app.

In chrome dev tools, it says "Source Map Detected" - but using ctrl+p does not show any ponents. Just a few random js files like page.js, inject.js, mon.js, etc

I have these two files on my server:

/react/build/static/js/stats.js

and

/react/build/static/js/main.5c7483.js

In the stats.js file, it has this line at the bottom:

//# sourceMappingURL=main.8c33616f.js.map (I noticed the filename does not match)

The react app works fine, but I want to make some small changes. However, the developer has told me they pletely lost the original source files due to a hard drive failure.

Is it possible to recover source files (or even anything that resembles source code?) I found this debundle package but couldn't get the configuration to work properly.

They told me the project was created using create-react-app.

In chrome dev tools, it says "Source Map Detected" - but using ctrl+p does not show any ponents. Just a few random js files like page.js, inject.js, mon.js, etc

• javascript
• reactjs

Share Improve this question Follow asked May 13, 2019 at 20:16 kmoney12kmoney12 4,49055 gold badges4040 silver badges6161 bronze badges 1

• Does the sourcemap file actually exist? Can you navigate to it in your browser or pull it down from your server? The sourcemap file is used to map optimized code back to its original form for debugging. If it's there it will have, more or less, a copy of the source code it represents. There may be other project artifacts (build configuration, other source chunks, etc.) needed to reconstruct the whole project. – ray Commented May 13, 2019 at 21:54

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 9

Well, this answer is late but just in case other people e here looking for answers (like me), here's how I solved it:

If you're lucky and the developers generated and uploaded the source maps then you shouldn't have any issue accessing the source codes.

Using Chrome(or any modern browser), browse to the website where the react app is hosted. Right-click anywhere on the page and select Inspect. Ctrl+Shift+I works too.

This will open up the dev tools window. Select the Sources tab.

Depending on the website's dependencies, you'll probably see several folders here. The first folder will be titled similar to the name of the website's URL. Open that up, that's where the sources for your website is located. Opening that folder will show yet another list of folders (assets, static, modules, react-ponents, src).

At this point, you may think your source codes are inside the src folder but that's not where yours are. To find yours, open up the static folder.

This folder has three inner folders: css, js and node_modules. Your JS source files are inside the js folder so that's where to look for your source codes.

So that's it. I hope this helps. It definitely did help me when I needed it!

本文标签： javascriptCan I use a sourcemap and bundle file to retrieve original react codeStack Overflow