search

Greenstand / treetracker-web-map-client

The front end of the treetracker web map app.
http://map.treetracker.org
GNU Affero General Public License v3.0
64 stars 182 forks source link

The next.js dev mode can not display the source code correctly #940

Closed dadiorchen closed 1 year ago

dadiorchen commented 2 years ago

The next.js should be able to display the source code rather than compiled bundle raw javascript code as shown below:

Image

keyy123 commented 1 year ago

@dadiorchen, What version of next.js does CWM use?

We could edit the next.js config to output error from source code linked to minified js or we could set the devTool property to create a cheap-module-eval-source-map in webpack.config if the mode is development

link 1

keyy123 commented 1 year ago

Update:

This is not an issue with treetrackerWM-client, I tested the source map by deliberately making errors in it. They all link back to the source code @dadiorchen. The issue here is the imported package treetracker-WM-core exports an already minified file (main.js) which is how the project here access/consumes it. This means the client sourcemap is working correctly.

If we want to see the original source code from core repo in client repo(here) when runtime errors happen, We would have to minify the core repo in a way where the original source code is bundled into the minified code.

I don't know the potential risks that adding a source map to the exported API could introduce but it will clear the error up. We could also use 3rd party services like honeybadger to hold our sourcemaps.

dadiorchen commented 1 year ago

@keyy123 which means we can close this issue now?

And let's continue the discussion of the honeybadger, it is something in our consideration too.

dadiorchen commented 1 year ago

Thanks for the analysis

dadiorchen commented 1 year ago

I think we just need to access source-map in development mode, it is good enough

dadiorchen commented 1 year ago

@keyy123 I hope you can raise some discussion in the #engerning channel, about the log tracing and monitoring, I did some research on Sentry https://sentry.io/ it seems the same role as honeybadger, also, the mobile team (android,ios) prefer to firebase (it has log tracing feature with free charge but I am sure they are real), but I wanted to unify all clients: web, native, node.js, maybe it is impossible, so maybe your experience on this can help us build the understanding on this.