Skip to content

Commit

Permalink
Add Next.js-specific bundling information (#27444)
Browse files Browse the repository at this point in the history
* Add Next.js-specific bundling information

* Change parenthetical to note as per suggestion

Co-authored-by: Thomas Hunter II <[email protected]>

---------

Co-authored-by: Thomas Hunter II <[email protected]>
  • Loading branch information
szegedi and tlhunter authored Feb 7, 2025
1 parent 71ee4d4 commit 7d378d5
Showing 1 changed file with 46 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,7 @@ Datadog recommends you have custom-built bundler plugins. These plugins are able

**Note**: Some applications can have 100% of modules bundled, however native modules still need to remain external to the bundle.

#### Esbuild support
#### Bundling with Esbuild

This library provides experimental esbuild support in the form of an esbuild plugin, and requires at least Node.js v16.17 or v18.7. To use the plugin, make sure you have `dd-trace@3+` installed, and then require the `dd-trace/esbuild` module when building your bundle.

Expand All @@ -148,7 +148,7 @@ esbuild.build({
platform: 'node', // allows built-in modules to be required
target: ['node16'],
external: [
// esbuild cannot bundle native modules
// required if you use native metrics
'@datadog/native-metrics',

// required if you use profiling
Expand All @@ -170,6 +170,48 @@ esbuild.build({
})
```

#### Bundling with Next.js

If you are using Next.js or another framework relying on webpack to bundle your application, add a declaration
similar to the one for webpack inside your `next.config.js` configuration file:

```javascript
/** @type {import('next').NextConfig} */
const nextConfig = {
// ... non-relevant parts omitted, substitute your own config ...

// this custom webpack config is required for Datadog tracing to work
webpack: (
config,
{ buildId, dev, isServer, defaultLoaders, nextRuntime, webpack }
) => {
const externals = [
// required if you use native metrics
'@datadog/native-metrics',

// required if you use profiling
'@datadog/pprof',

// required if you use Datadog security features
'@datadog/native-appsec',
'@datadog/native-iast-taint-tracking',
'@datadog/native-iast-rewriter',

// required if you encounter graphql errors during the build step
'graphql/language/visitor',
'graphql/language/printer',
'graphql/utilities'
];
config.externals.push(...externals);
return config;
},
};

export default nextConfig;
```

#### General bundling remarks

**Note**: Due to the usage of native modules in the tracer, which are compiled C++ code, (usually ending with a `.node` file extension), you need to add entries to your `external` list. Currently native modules used in the Node.js tracer live inside of `@datadog` prefixed packages. This will also require that you ship a `node_modules/` directory alongside your bundled application. You don't need to ship your entire `node_modules/` directory as it would contain many superfluous packages that should be contained in your bundle.

To generate a smaller `node_modules/` directory with only the required native modules, (and their dependencies) you can first determine the versions of packages that you need, then create a temporary directory to install them into, and copy the resulting `node_modules/` directory from it. For example:
Expand All @@ -188,6 +230,8 @@ npm install @datadog/[email protected] @datadog/[email protected]
cp -R ./node_modules path/to/bundle
```

**Note**: In case of Next.js the `path/to/bundle` is usually the `.next/standalone` directory of your app.

At this stage you should be able to deploy your bundle, (which is your application code and most of your dependencies), with the `node_modules/` directory, which contains the native modules and their dependencies.

## Configuration
Expand Down

0 comments on commit 7d378d5

Please sign in to comment.