feat(turbo-tracing): implement next plugin (vercel#267)

Author: Brooooooklyn

.eslintrc.yaml

@@ -13,7 +13,7 @@ ignorePatterns:
   - dist
   - node_modules
   - crates
-  - packages/webpack-nmt/test/with-mongodb-mongoose
+  - packages/turbo-tracing-next-plugin/test/with-mongodb-mongoose
 
 env:
   browser: false

.prettierignore

@@ -5,5 +5,5 @@ crates/turbopack-ecmascript/tests
 crates/turbopack/tests/node-file-trace/integration
 crates/turbopack/bench.json
 packages/node-module-trace/npm
-packages/webpack-nmt/test/with-mongodb-mongoose
+packages/turbo-tracing-next-plugin/test/with-mongodb-mongoose
 dist

package.json

@@ -3,7 +3,7 @@
   "private": true,
   "workspaces": [
     "packages/*",
-    "packages/webpack-nmt/test/with-mongodb-mongoose",
+    "packages/turbo-tracing-next-plugin/test/with-mongodb-mongoose",
     "crates/turbopack/tests/node-file-trace",
     "crates/next-dev/tests"
   ],

packages/turbo-tracing-next-plugin/README.md

@@ -0,0 +1,37 @@
+# `@vercel/turbo-tracing-next-plugin`
+
+## Installation
+
+-   yarn add -D `@vercel/turbo-tracing-next-plugin`
+-   npm install -D `@vercel/turbo-tracing-next-plugin`
+-   pnpm install -D `@vercel/turbo-tracing-next-plugin`
+
+## Usage
+
+```js
+// next.config.js
+
+const { withTurboTracing } = require('@vercel/turbo-tracing-next-plugin')
+
+module.exports = withTurboTracing({
+    // turbo tracing options
+    log: {
+        all: true,
+    },
+})({
+    // next config
+})
+```
+
+### turbo tracing options
+
+> **Note**
+>
+> The default options should work fine.
+
+-   `cwd?: string`, default is `process.cwd()`, you can override it to specify another directory to run turbo tracing.
+-   `contextDirectory?: string`, relative to cwd, default is `.`.
+-   `path?: string`, additional path which will be appended into the `PATH` environment variable.
+-   `log?.all?: boolean`, default is `false`, whether to show all logs.
+-   `log?.level?: string`, default is `error`, the log level.
+-   `log?.detail?: boolean`, default is `false`, whether to expand the log details.

packages/turbo-tracing-next-plugin/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "@vercel/turbo-tracing-next-plugin",
+  "version": "0.0.0",
+  "license": "UNLICENSED",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist/**/*"
+  ],
+  "publishConfig": {
+    "access": "restricted"
+  },
+  "dependencies": {
+    "@vercel/webpack-node-module-trace": "0.0.3"
+  },
+  "peerDependencies": {
+    "next": ">= 12"
+  },
+  "devDependencies": {
+    "next": "^12.2.5"
+  }
+}

packages/turbo-tracing-next-plugin/src/index.ts

@@ -0,0 +1,25 @@
+import {
+  NodeModuleTracePlugin,
+  NodeModuleTracePluginOptions,
+} from '@vercel/webpack-node-module-trace'
+import type { NextConfig } from 'next'
+
+export function withTurboTracing(options?: NodeModuleTracePluginOptions) {
+  return function createTurboTracingConfig(config: NextConfig = {}) {
+    const createWebpackConfig = config.webpack
+    config.outputFileTracing = false
+    config.webpack = (webpackConfig, context) => {
+      const config =
+        createWebpackConfig?.(webpackConfig, context) ?? webpackConfig
+      const plugin = new NodeModuleTracePlugin(options)
+      if (config.plugins) {
+        config.plugins.push(plugin)
+      } else {
+        config.plugins = [plugin]
+      }
+
+      return config
+    }
+    return config
+  }
+}

packages/webpack-nmt/test/with-mongodb-mongoose/.env.local.example packages/turbo-tracing-next-plugin/test/with-mongodb-mongoose/.env.local.example

@@ -0,0 +1,12 @@
+const { join } = require('path')
+
+const { withTurboTracing } = require('../..')
+
+module.exports = withTurboTracing({
+  path: join(__dirname, '..', '..', '..', '..', 'target', 'debug'),
+})({
+  reactStrictMode: true,
+  eslint: {
+    ignoreDuringBuilds: true,
+  },
+})

packages/webpack-nmt/test/with-mongodb-mongoose/.gitignore packages/turbo-tracing-next-plugin/test/with-mongodb-mongoose/.gitignore

@@ -1,5 +1,5 @@
 {
-  "name": "@vercel/nmt-test-app",
+  "name": "@vercel/turbo-tracing-test-app",
   "private": true,
   "scripts": {
     "dev": "next dev",
@@ -14,7 +14,7 @@
     "swr": "^1.3.0"
   },
   "devDependencies": {
-    "@vercel/node-module-trace": "0.0.1",
+    "@vercel/turbo-tracing-next-plugin": "0.0.0",
     "cross-env": "^7.0.3"
   }
 }

packages/webpack-nmt/test/with-mongodb-mongoose/README.md packages/turbo-tracing-next-plugin/test/with-mongodb-mongoose/README.md

@@ -0,0 +1,14 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "composite": true,
+    "outDir": "./dist",
+    "rootDir": "./src"
+  },
+  "include": ["src"],
+  "references": [
+    {
+      "path": "../webpack-nmt"
+    }
+  ]
+}

packages/webpack-nmt/test/with-mongodb-mongoose/components/Form.js packages/turbo-tracing-next-plugin/test/with-mongodb-mongoose/components/Form.js

@@ -9,6 +9,21 @@ export interface NodeModuleTracePluginOptions {
   contextDirectory?: string
   // additional PATH environment variable to use for spawning the `node-file-trace` process
   path?: string
+  // log options
+  log?: {
+    all?: boolean
+    detail?: boolean
+    // Default is `error`
+    level?:
+      | 'bug'
+      | 'fatal'
+      | 'error'
+      | 'warning'
+      | 'hint'
+      | 'note'
+      | 'suggestions'
+      | 'info'
+  }
 }
 
 export class NodeModuleTracePlugin implements WebpackPluginInstance {
@@ -63,25 +78,54 @@ export class NodeModuleTracePlugin implements WebpackPluginInstance {
   }
 
   private runTrace() {
-    spawnSync(
-      'node-file-trace',
-      [
-        'annotate',
-        '--context-directory',
-        this.options?.contextDirectory ?? '.',
-        '--exact',
-        ...this.chunksToTrace,
-      ],
-      {
-        stdio: 'inherit',
-        env: {
-          ...process.env,
-          PATH: `${this.options?.path ?? ''}${
-            process.platform === 'win32' ? ';' : ':'
-          }${process.env.PATH}`,
-        },
-        cwd: this.options?.cwd ?? process.cwd(),
+    process.stdout.write('\n')
+    const args = [
+      'annotate',
+      '--context-directory',
+      this.options?.contextDirectory ?? '.',
+      '--exact',
+    ]
+    if (this.options?.log?.detail) {
+      args.push('--log-detail')
+    }
+    if (this.options?.log?.all) {
+      args.push('--show-all')
+    }
+    const logLevel = this.options?.log?.level
+    if (logLevel) {
+      args.push(`--log-level ${logLevel}`)
+    }
+    let turboTracingPackagePath = ''
+    let turboTracingBinPath = ''
+    try {
+      turboTracingPackagePath = require.resolve('@vercel/node-module-trace')
+    } catch (e) {
+      // ignore
+    }
+    if (turboTracingPackagePath) {
+      try {
+        turboTracingBinPath = require.resolve(
+          `@vercel/node-module-trace-${process.platform}-${process.arch}`,
+          {
+            paths: [turboTracingPackagePath],
+          },
+        )
+      } catch (e) {
+        // ignore
+      }
+    }
+    const pathSep = process.platform === 'win32' ? ';' : ':'
+    let paths = `${this.options?.path ?? ''}${pathSep}${process.env.PATH}`
+    if (turboTracingBinPath) {
+      paths = `${turboTracingBinPath}${pathSep}${paths}`
+    }
+    spawnSync('node-file-trace', [...args, ...this.chunksToTrace], {
+      stdio: 'inherit',
+      env: {
+        ...process.env,
+        PATH: paths,
       },
-    )
+      cwd: this.options?.cwd ?? process.cwd(),
+    })
   }
 }

packages/webpack-nmt/test/with-mongodb-mongoose/css/form.css packages/turbo-tracing-next-plugin/test/with-mongodb-mongoose/css/form.css

@@ -7,7 +7,11 @@
     "importHelpers": false,
     "noEmitHelpers": false,
     "skipLibCheck": true,
-    "outDir": "./dist"
+    "outDir": "./dist",
+    "baseUrl": "./packages",
+    "paths": {
+      "@vercel/webpack-node-module-trace": ["webpack-nmt/src/index.ts"]
+    }
   },
   "exclude": ["node_modules", "crates", ".yarn", "target"]
 }

packages/webpack-nmt/test/with-mongodb-mongoose/css/style.css packages/turbo-tracing-next-plugin/test/with-mongodb-mongoose/css/style.css

@@ -1,5 +1,8 @@
 {
   "extends": "./tsconfig.json",
   "include": [],
-  "references": [{ "path": "./packages/webpack-nmt" }]
+  "references": [
+    { "path": "./packages/webpack-nmt" },
+    { "path": "./packages/turbo-tracing-next-plugin" }
+  ]
 }