View your source map files produced using webpack

My application uses django on the backend and Vuejs on the frontend (doesn't use vue-cli). So the index.js from Vue is used something like this in my base.html

{% compress js %}
  <script type="module" src="{% static 'path/to/index.js' %}"></script>
{% endcompress %}

Producing this -> index.4b6f970ead9c.js -> A compressed file in static/CACHE/js

I need to build source-maps as .map files which in the end will be uploaded to sentry.

Following is in my webpack.config.js :

devtool: 'source-map',
output: {
  sourceMapFilename: '[file].map',
}

Doing this, I get a warning on my console :

DevTools failed to load SourceMap: Could not load content for http://localhost:8000/static/CACHE/js/tmpy_nqoqkg.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

I should expect the .map file to be in static/CACHE/js right? I couldn't any file with a .map extension anywhere in my app.

But in the end of this (index.4b6f970ead9c.js) compressed file that is loaded I do see a mapping : //# sourceMappingURL=tmpy_nqoqkg.js.map

Is there any way I can physically save the .map file for my application and use it later?