From 1ef1ff5f28197da2718c7c8ac8a67511741d69db Mon Sep 17 00:00:00 2001 From: Francesco Novy Date: Tue, 14 Feb 2023 12:44:24 +0100 Subject: [PATCH] build(replay): Improve replay-worker build --- packages/replay-worker/package.json | 13 ++-- .../replay-worker/rollup.worker.config.js | 62 ++++++++++++------- packages/replay-worker/src/_worker.ts | 12 ++++ .../{vendor/index.js => src/index.ts} | 5 +- packages/replay-worker/src/worker.ts | 15 +---- packages/replay-worker/tsconfig.types.json | 10 +++ packages/replay-worker/vendor/index.d.ts | 1 - packages/replay-worker/vendor/worker.d.ts | 2 - yarn.lock | 39 +----------- 9 files changed, 75 insertions(+), 84 deletions(-) create mode 100644 packages/replay-worker/src/_worker.ts rename packages/replay-worker/{vendor/index.js => src/index.ts} (61%) create mode 100644 packages/replay-worker/tsconfig.types.json delete mode 100644 packages/replay-worker/vendor/index.d.ts delete mode 100644 packages/replay-worker/vendor/worker.d.ts diff --git a/packages/replay-worker/package.json b/packages/replay-worker/package.json index 313bb14f856e..e4d05b39c345 100644 --- a/packages/replay-worker/package.json +++ b/packages/replay-worker/package.json @@ -2,18 +2,20 @@ "name": "@sentry-internal/replay-worker", "version": "7.37.2", "description": "Worker for @sentry/replay", - "main": "build/index.js", - "module": "build/index.js", + "main": "build/npm/esm/index.js", + "module": "build/npm/esm/index.js", + "types": "build/npm/types/index.d.ts", "sideEffects": false, "private": true, "scripts": { - "build": "yarn build:transpile", + "build": "run-p build:transpile build:types", "build:transpile": "rollup -c rollup.worker.config.js", - "build:types": "yarn build:transpile", + "build:types": "tsc -p tsconfig.types.json", "build:dev": "yarn build", - "build:watch": "run-p build:transpile:watch", + "build:watch": "run-p build:transpile:watch build:types:watch", "build:dev:watch": "run-p build:watch", "build:transpile:watch": "yarn build:rollup --watch", + "build:types:watch": "yarn build:types --watch", "clean": "rimraf build", "fix": "run-s fix:eslint fix:prettier", "fix:eslint": "eslint . --format stylish --fix", @@ -36,7 +38,6 @@ "homepage": "https://docs.sentry.io/platforms/javascript/session-replay/", "devDependencies": { "@types/pako": "^2.0.0", - "rollup-plugin-copy": "~3.4.0", "tslib": "^1.9.3" }, "dependencies": { diff --git a/packages/replay-worker/rollup.worker.config.js b/packages/replay-worker/rollup.worker.config.js index 15506c2f0eab..7149be6612b0 100644 --- a/packages/replay-worker/rollup.worker.config.js +++ b/packages/replay-worker/rollup.worker.config.js @@ -4,32 +4,46 @@ import resolve from '@rollup/plugin-node-resolve'; import typescript from '@rollup/plugin-typescript'; import { defineConfig } from 'rollup'; import { terser } from 'rollup-plugin-terser'; -import copy from 'rollup-plugin-copy'; -const config = defineConfig({ - input: ['./src/worker.ts'], - output: { - dir: './build/', - format: 'esm', +const config = defineConfig([ + { + input: ['./src/index.ts'], + output: { + dir: './build/npm/esm', + format: 'esm', + }, + external: ['./worker'], + plugins: [ + typescript({ tsconfig: './tsconfig.json', inlineSourceMap: false, sourceMap: false, inlineSources: false }), + terser({ + mangle: { + module: true, + }, + }), + ], }, - plugins: [ - typescript({ tsconfig: './tsconfig.json', inlineSourceMap: false, sourceMap: false, inlineSources: false }), - resolve(), - terser({ - mangle: { - module: true, - }, - }), - { - name: 'worker-to-string', - renderChunk(code) { - return `export default \`${code}\`;`; - }, + { + input: ['./src/_worker.ts'], + output: { + file: './build/npm/esm/worker.ts', + format: 'esm', }, - copy({ - targets: [{ src: 'vendor/*', dest: 'build' }], - }), - ], -}); + plugins: [ + typescript({ tsconfig: './tsconfig.json', inlineSourceMap: false, sourceMap: false, inlineSources: false }), + resolve(), + terser({ + mangle: { + module: true, + }, + }), + { + name: 'worker-to-string', + renderChunk(code) { + return `export default \`${code}\`;`; + }, + }, + ], + }, +]); export default config; diff --git a/packages/replay-worker/src/_worker.ts b/packages/replay-worker/src/_worker.ts new file mode 100644 index 000000000000..d81bb43d46df --- /dev/null +++ b/packages/replay-worker/src/_worker.ts @@ -0,0 +1,12 @@ +import { handleMessage } from './handleMessage'; + +addEventListener('message', handleMessage); + +// Immediately send a message when worker loads, so we know the worker is ready +// @ts-ignore this syntax is actually fine +postMessage({ + id: undefined, + method: 'init', + success: true, + response: undefined, +}); diff --git a/packages/replay-worker/vendor/index.js b/packages/replay-worker/src/index.ts similarity index 61% rename from packages/replay-worker/vendor/index.js rename to packages/replay-worker/src/index.ts index 9bf87542112b..103568d7a8d4 100644 --- a/packages/replay-worker/vendor/index.js +++ b/packages/replay-worker/src/index.ts @@ -1,6 +1,9 @@ import workerString from './worker'; -export function getWorkerURL() { +/** + * Get the URL for a web worker. + */ +export function getWorkerURL(): string { const workerBlob = new Blob([workerString]); return URL.createObjectURL(workerBlob); } diff --git a/packages/replay-worker/src/worker.ts b/packages/replay-worker/src/worker.ts index d81bb43d46df..e31356388d35 100644 --- a/packages/replay-worker/src/worker.ts +++ b/packages/replay-worker/src/worker.ts @@ -1,12 +1,3 @@ -import { handleMessage } from './handleMessage'; - -addEventListener('message', handleMessage); - -// Immediately send a message when worker loads, so we know the worker is ready -// @ts-ignore this syntax is actually fine -postMessage({ - id: undefined, - method: 'init', - success: true, - response: undefined, -}); +// This is replaced at build-time with the content from _worker.ts, wrapped as a string. +// This is just a placeholder so that types etc. are correct. +export default '' as string; diff --git a/packages/replay-worker/tsconfig.types.json b/packages/replay-worker/tsconfig.types.json new file mode 100644 index 000000000000..58b6f60a32b1 --- /dev/null +++ b/packages/replay-worker/tsconfig.types.json @@ -0,0 +1,10 @@ +{ + "extends": "./tsconfig.json", + "include": ["src/index.ts", "src/worker.ts"], + "compilerOptions": { + "declaration": true, + "declarationMap": true, + "emitDeclarationOnly": true, + "outDir": "build/npm/types" + } +} diff --git a/packages/replay-worker/vendor/index.d.ts b/packages/replay-worker/vendor/index.d.ts deleted file mode 100644 index 63e84bb3ac83..000000000000 --- a/packages/replay-worker/vendor/index.d.ts +++ /dev/null @@ -1 +0,0 @@ -export function getWorkerURL(): string; diff --git a/packages/replay-worker/vendor/worker.d.ts b/packages/replay-worker/vendor/worker.d.ts deleted file mode 100644 index 1dd215b1e7b2..000000000000 --- a/packages/replay-worker/vendor/worker.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -declare const workerString: string; -export default workerString; diff --git a/yarn.lock b/yarn.lock index fdb1f6cf674e..61778398af84 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3785,13 +3785,6 @@ dependencies: "@types/node" "*" -"@types/fs-extra@^8.0.1": - version "8.1.2" - resolved "https://registry.yarnpkg.com/@types/fs-extra/-/fs-extra-8.1.2.tgz#7125cc2e4bdd9bd2fc83005ffdb1d0ba00cca61f" - integrity sha512-SvSrYXfWSc7R4eqnOzbQF4TZmfpNSM9FrSWLU3EUnWBuyZqNBOrv1B1JA3byUDPUl9z4Ab3jeZG2eDdySlgNMg== - dependencies: - "@types/node" "*" - "@types/fs-extra@^8.1.0": version "8.1.1" resolved "https://registry.yarnpkg.com/@types/fs-extra/-/fs-extra-8.1.1.tgz#1e49f22d09aa46e19b51c0b013cb63d0d923a068" @@ -8204,7 +8197,7 @@ color@^3.0.0: color-convert "^1.9.1" color-string "^1.5.4" -colorette@^1.1.0, colorette@^1.2.1, colorette@^1.2.2: +colorette@^1.2.1, colorette@^1.2.2: version "1.4.0" resolved "https://registry.yarnpkg.com/colorette/-/colorette-1.4.0.tgz#5190fbb87276259a86ad700bff2c6d6faa3fca40" integrity sha512-Y2oEozpomLn7Q3HFP7dpww7AtMJplbM9lGZP6RDfHqmbeRjiwRg4n6VM6j4KLmRke85uWEI7JqF17f3pqdRA0g== @@ -12657,20 +12650,6 @@ globby@10.0.0: merge2 "^1.2.3" slash "^3.0.0" -globby@10.0.1: - version "10.0.1" - resolved "https://registry.yarnpkg.com/globby/-/globby-10.0.1.tgz#4782c34cb75dd683351335c5829cc3420e606b22" - integrity sha512-sSs4inE1FB2YQiymcmTv6NWENryABjUNPeWhOvmn4SjtKybglsyPZxFB3U1/+L1bYi0rNZDqCLlHyLYDl1Pq5A== - dependencies: - "@types/glob" "^7.1.1" - array-union "^2.1.0" - dir-glob "^3.0.1" - fast-glob "^3.0.3" - glob "^7.1.3" - ignore "^5.1.1" - merge2 "^1.2.3" - slash "^3.0.0" - globby@11.1.0, globby@^11.0.1, globby@^11.0.2, globby@^11.0.3, globby@^11.1.0: version "11.1.0" resolved "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz#bd4be98bb042f83d796f7e3811991fbe82a0d34b" @@ -14165,11 +14144,6 @@ is-plain-object@^2.0.1, is-plain-object@^2.0.3, is-plain-object@^2.0.4: dependencies: isobject "^3.0.1" -is-plain-object@^3.0.0: - version "3.0.1" - resolved "https://registry.yarnpkg.com/is-plain-object/-/is-plain-object-3.0.1.tgz#662d92d24c0aa4302407b0d45d21f2251c85f85b" - integrity sha512-Xnpx182SBMrr/aBik8y+GuR4U1L9FqMSojwDQwPMmxyC6bvEqly9UBCxhauBF5vNh2gwWJNX6oDV7O+OM4z34g== - is-plain-object@^5.0.0: version "5.0.0" resolved "https://registry.yarnpkg.com/is-plain-object/-/is-plain-object-5.0.0.tgz#4427f50ab3429e9025ea7d52e9043a9ef4159344" @@ -21149,17 +21123,6 @@ rollup-plugin-cleanup@3.2.1: js-cleanup "^1.2.0" rollup-pluginutils "^2.8.2" -rollup-plugin-copy@~3.4.0: - version "3.4.0" - resolved "https://registry.yarnpkg.com/rollup-plugin-copy/-/rollup-plugin-copy-3.4.0.tgz#f1228a3ffb66ffad8606e2f3fb7ff23141ed3286" - integrity sha512-rGUmYYsYsceRJRqLVlE9FivJMxJ7X6jDlP79fmFkL8sJs7VVMSVyA2yfyL+PGyO/vJs4A87hwhgVfz61njI+uQ== - dependencies: - "@types/fs-extra" "^8.0.1" - colorette "^1.1.0" - fs-extra "^8.1.0" - globby "10.0.1" - is-plain-object "^3.0.0" - rollup-plugin-license@^2.6.1: version "2.6.1" resolved "https://registry.yarnpkg.com/rollup-plugin-license/-/rollup-plugin-license-2.6.1.tgz#20f15cc37950f362f8eefdc6e3a2e659d0cad9eb"