Use theDeveloper Resources panel to check if DevTools loads source maps successfully. If required, you can load them manually.

Key point: To learn how source maps can make debugging easier for you, seeDebug your original code instead of deployed with source maps.

Overview

When you open DevTools, it attempts to load source maps, if any. In case of failure, theConsole logs an error similar to the following.

In theDeveloper Resources panel, you can view the source map load status and even load source maps manually.

Open Developer Resources and check status

To check the load statuses of source maps:

1. Open DevTools, make sure toenable source maps, and navigate tomore_vert >More tools >Developer Resources.

2. In the table, check the values in the following columns:

   • Status to see if the source map loading was a success or failure.
   • Error to read the error message, if any.

Filter resources by URL or Error

To focus on source maps that interest you, enter text in the textbox at the top to filter out source maps that don't contain this text in URLs or error messages.

Troubleshoot loading source maps

By default, DevTools requests source maps rather than the website. Such requests may be treated ascross-origin and might not get through.

To make the website request source maps first, in the top right corner ofDeveloper Resources, checkLoad through website.

If you still have issues with loading source maps, try to load them manually as described next.

Load a source map manually

If you encounter load failures or, for example, want todebug your original code on a website in production that lacks source maps, you can load them manually:

1. Generate source maps using tools that support them.
2. Host the source maps locally.
3. Open DevTools on your page and make sure toenable source maps.

4. Open the deployed (processed) file inSources, right-click it in theEditor, and selectAdd source map from the menu.

   

5. In the textbox, specify the source map URL and clickAdd.

   

6. Check if the source map appeared inDeveloper Resources and the original file (mapped from the deployed one) in the file tree.

   

7. Proceed todebug your original file.