Node.js: Upload Sourcemaps using Hud CLI

Hud CLI provides a simple and efficient way to upload your application’s sourcemaps to Hud’s server.

📘

Sourcemaps

What is it? Sourcemaps are files that map your minified or transpiled JavaScript code back to the original source code. When utilizing a transpiler or bundler, the source code is transformed into a different format for distribution, typically consolidated into a limited number of files.

Hud uses sourcemaps to translate the running code into its original form (the source code form).


Prerequisites

Before using the Hud CLI to upload sourcemaps, ensure that you have the following:

  1. Node.js installed (version 18.x or higher recommended)
  2. Hud CLI installed globally or available locally in your project
  3. A valid Hud API Key for authentication

1. Installation

npm install --save-dev @code-hud/hud-cli
yarn add --dev @code-hud/hud-cli
pnpm add --save-dev @code-hud/hud-cli

2. Add sourcemap creation configuration to your build tool

To successfully upload sourcemaps, your build tool (e.g., Webpack, Rollup, or Vite) must be configured to generate sourcemaps. Below are examples for common build tools:

npx babel ... --source-maps
// Add to babel.config.json:

{
  ...
  "sourceMaps": true  
}
// Add to tsconfig.js:

{
  "compilerOptions": {  
		"sourceMap": true  
	}
}

You can now verify the creation of .map files alongside your bundled JavaScript files in the dist directory.

📘

What is the dist Folder?

The dist (short for "distribution") folder is a common convention in web development. It is the directory where the final, production-ready version of your application is generated after the build process, including your newly created .map files.


3. Run hud-cli

After every successful build, run hud-cli for your local with the CLI sourcemap key, and point it to the dist folder

npx hud-cli sourcemap <path_to_dist_folder> --access-key <sourcemap_key>

Required Options

OptionDescription
<path_to_dist_folder>Required. The path to the directory containing your sourcemaps.
--access-keyRequired. Your Hud sourcemap API key used for authentication.