feat: Add Parcel plugin (#4)

timfish · web-flow · commit 47cd25df6972 · 2024-10-02T11:16:30.000+02:00
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,4 @@
 node_modules/
 dist/
 .DS_Store
+.parcel-cache/
diff --git a/README.md b/README.md
@@ -107,4 +107,16 @@ export default {
     sourcemap: true,
   },
 };
+```
+
+## Parcel
+
+`.parcelrc`
+```json
+{
+  "extends": "@parcel/config-default",
+  "optimizers": {
+    "*.{js,cjs,mjs}": ["...", "@sentry/debug-ids/parcel"]
+  }
+}
 ```
diff --git a/package.json b/package.json
@@ -26,6 +26,10 @@
     "rolldown": {
       "require": "./dist/cjs/rolldown.js",
       "import": "./dist/esm/rolldown.mjs"
+    },
+    "parcel": {
+      "require": "./dist/cjs/parcel.js",
+      "import": "./dist/esm/parcel.js"
     }
   },
   "scripts": {
@@ -42,6 +46,7 @@
     "@types/node": "14",
     "esbuild": "^0.24.0",
     "prettier": "^3.3.3",
+    "parcel": "^2.12.0",
     "rolldown": "^0.13.2",
     "rollup": "^4.22.5",
     "typescript": "^5.6.2",
diff --git a/rollup.config.mjs b/rollup.config.mjs
@@ -29,6 +29,14 @@ function transpileNode(format, input, outDir) {
   };
 }
 
-const inputs = ['src/esbuild.ts', 'src/rolldown.ts', 'src/rollup.ts', 'src/rspack.ts', 'src/vite.ts', 'src/webpack.ts'];
+const inputs = [
+  'src/esbuild.ts',
+  'src/parcel.ts',
+  'src/rolldown.ts',
+  'src/rollup.ts',
+  'src/rspack.ts',
+  'src/vite.ts',
+  'src/webpack.ts',
+];
 
 export default [transpileNode('cjs', inputs, 'dist/cjs'), transpileNode('esm', inputs, 'dist/esm')];
diff --git a/src/parcel.ts b/src/parcel.ts
@@ -0,0 +1,39 @@
+import { Optimizer } from '@parcel/plugin';
+import { stringToUUID, addDebugIdToSource } from './common';
+import type { SourceMap } from 'rollup';
+
+export default new Optimizer({
+  async optimize({ contents, map }) {
+    // We only add debugId where there is a linked sourcemap file
+    if (!map) {
+      return { contents, map };
+    }
+
+    const contentsString = contents.toString();
+    const debugId = stringToUUID(contentsString);
+
+    // This is nasty but Parcel uses a native module to handle sourcemaps, so
+    // the only way I could find to add the debugId to the sourcemap is to proxy
+    // the map 'toVLQ()' method to add the debugId to the sourcemap object...
+    const proxiedMap = new Proxy(map, {
+      get: function (target, prop, receiver) {
+        if (prop === 'toVLQ') {
+          const original = Reflect.get(target, prop, receiver);
+
+          return function toVLQ(this: SourceMap) {
+            const result = original.apply(this);
+            result.debugId = debugId;
+            return result;
+          };
+        }
+
+        return Reflect.get(target, prop, receiver);
+      },
+    });
+
+    return {
+      contents: addDebugIdToSource(contentsString, debugId),
+      map: proxiedMap,
+    };
+  },
+});
diff --git a/test/parcel/parcel.test.ts b/test/parcel/parcel.test.ts
@@ -0,0 +1,40 @@
+import { describe, test } from 'vitest';
+import { execFileSync } from 'child_process';
+import { join } from 'path';
+import { TestOptions, cleanDir, testResults } from '../utils';
+
+const __dirname = new URL('.', import.meta.url).pathname;
+
+function parcelTest(path: string, options: TestOptions) {
+  const baseDir = join(__dirname, path);
+  cleanDir(baseDir, 'dist');
+  execFileSync(
+    'parcel',
+    [
+      'build',
+      '--no-cache',
+      '--dist-dir',
+      './dist',
+      '--config',
+      './.parcelrc',
+      '--cache-dir',
+      './.parcel-cache',
+      './src/index.html',
+    ],
+    {
+      cwd: baseDir,
+      stdio: 'inherit',
+    },
+  );
+
+  testResults(baseDir, options);
+}
+
+describe('parcel', () => {
+  test('with sourcemaps', () => {
+    parcelTest('with-sourcemaps', {
+      'index.9ed5572c.js': { hasDebugIds: true, hasSourceMapUrl: true },
+      'another.3bf0f9d4.js': { hasDebugIds: true, hasSourceMapUrl: true },
+    });
+  });
+});
diff --git a/test/parcel/with-sourcemaps/.parcelrc b/test/parcel/with-sourcemaps/.parcelrc
@@ -0,0 +1,9 @@
+{
+  "extends": "@parcel/config-default",
+  "optimizers": {
+    "*.{js,cjs,mjs}": [
+      "...",
+      "../../../dist/cjs/parcel.js"
+    ]
+  }
+}
diff --git a/test/parcel/with-sourcemaps/src/another.js b/test/parcel/with-sourcemaps/src/another.js
@@ -0,0 +1 @@
+console.log('anther');
diff --git a/test/parcel/with-sourcemaps/src/index.html b/test/parcel/with-sourcemaps/src/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Parcel App</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="./main.js"></script>
+  </body>
+</html>
diff --git a/test/parcel/with-sourcemaps/src/main.js b/test/parcel/with-sourcemaps/src/main.js
@@ -0,0 +1,2 @@
+console.log('do nothing');
+await import('./another.js');
diff --git a/yarn.lock b/yarn.lock

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+console.log('do nothing');`
	`2`	`+await import('./another.js');`