Skip to main content
Flashduty CLI is a command-line tool that supports uploading sourcemap files to the Flashduty server. Through sourcemap, frontend developers can more efficiently perform error tracking and debugging. Users can view uploaded sourcemap files in the “Application Management” - “Source Code Management” menu, and generate scripts through the upload panel to execute uploads locally.

Why Do You Need SourceMap?

In modern frontend development, JavaScript and CSS files are typically minified and obfuscated to optimize loading speed and performance. However, this minification causes code location information in error stacks to not directly map to the original source code, increasing debugging difficulty.

Map Minified Code

SourceMap records the mapping relationship between minified code and original code, allowing developers to view unminified source code during debugging

Precise Error Location

Through SourceMap, you can directly locate the specific position in the original source code in error tracking

Improve Debugging Efficiency

Developers don’t need to manually decode minified files, saving time troubleshooting issues

Generate SourceMap

Most modern build tools (such as Webpack, Rollup, or Vite) support generating SourceMap.
Enable SourceMap generation in webpack.config.js:
module.exports = {
  mode: "production",
  devtool: "source-map", // Generate separate .map files
  output: {
    filename: "bundle.js",
    path: path.resolve(__dirname, "dist"),
  },
};
After building, the dist directory will contain bundle.js and the corresponding bundle.js.map file.

Upload SourceMap

Use Flashduty CLI to upload sourcemap files to the Flashduty server.
1

Install Flashduty CLI

Ensure Node.js is installed, then install via npm:
npm install -g @flashcloud/flashcat-cli
2

Configure Upload Parameters

Upload Source Code Configuration
In the “Application Management” - “Source Code Management” menu, click the “Upload Source Code” panel and fill in the following information:
API Key
string
required
Used to authenticate your identity
Service Name
string
required
Application service name (e.g., my-service)
Version
string
required
Application release version (e.g., 1.0.0)
Minified Path Prefix
string
required
Path prefix for minified files (e.g., /assets)
3

Execute Upload

Run the generated script in the project root directory:
flashcat-cli sourcemaps upload \
  --service my-service \
  --release-version 1.0.0 \
  --minified-path-prefix /assets \
  --api-key your-api-key \
  ./dist
  • Ensure minified-path-prefix matches the actual deployed minified file path
  • After successful upload, you can view uploaded sourcemap files in “Application Management” - “Source Code Management”

SourceMap Management

On the Flashduty platform, sourcemap file management is done through the “Application Management” - “Source Code Management” menu:
FeatureDescription
View Uploaded SourceMapsList all uploaded files, including path, service name, version, size, and upload time
Version ManagementManage different application versions separately through service and release-version parameters
Permission ControlEnsure only authorized users can upload or manage through API Key

View Source Code in Error Tracking

RUM integrates sourcemap functionality, supporting direct viewing of original source code in the Error Tracking module for precise problem localization.
1

Capture Frontend Errors

RUM SDK automatically captures frontend errors (such as JavaScript exceptions, Promise rejections, network errors, etc.) and sends error stack information to the server.
throw new Error("Something went wrong");
2

Associate SourceMap

When the file path and line number in the error stack match an uploaded sourcemap, Flashduty automatically maps the minified code error location to the original source code.Minified file stack:
Error: Something went wrong
    at Object.<anonymous> (/assets/index-5e0391ac.js:1:123)
Mapped source code:
Error: Something went wrong
    at App.render (src/components/App.js:45:10)
3

View Error Details

In the Error Tracking module, click a specific error record to view:
  • Error message: e.g., Something went wrong
  • Original stack: Mapped source code file path, line number, and column number
  • Context code: Display source code snippet near the error location
4

Debug and Fix

Based on the mapped source code location, find the corresponding code directly in your local development environment, analyze the root cause, and fix it.

Best Practices

Integrate upload commands in CI/CD pipelines to ensure automatic sourcemap upload with each release.GitHub Actions Example:
- name: Upload SourceMaps
  run: |
    flashcat-cli sourcemaps upload \
      --service my-service \
      --release-version ${{ github.sha }} \
      --minified-path-prefix /assets \
      --api-key ${{ secrets.FLASHCAT_API_KEY }} \
      ./dist
Use the --release-version parameter to match the application version number for easy tracking of specific version sourcemaps.
Delete sourcemap files before uploading resources to CDN to avoid bringing source code information into production.
After uploading sourcemap, proactively throw test errors to verify that the Error Tracking module correctly maps to source code.

Frequently Asked Questions

  • Confirm that sourcemap was successfully uploaded and minified-path-prefix matches the actual deployment path
  • Check that service and release-version match the application version when the error occurred
  • Ensure sourcemap files are only uploaded to the Flashduty server, not directly exposed on the public network
  • In production, remove direct access to sourcemap files (e.g., through Nginx configuration)
  • Check if API Key is valid
  • Ensure network connection is normal and CLI version is the latest

Next Steps