fix rollup config (#72)

fix the bundle script so that we can use rrweb directly from a <script/> tag for use in server-side rrweb rendering (HIG-2197).
highlight · Apr 26, 2022 · a3c43bb · a3c43bb
1 parent 046c66c
commit a3c43bb
Show file tree

Hide file tree

Showing 6 changed files with 288 additions and 47 deletions.
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -13,7 +13,9 @@ jobs:
           registry-url: https://registry.npmjs.org
       - name: Install
         run: yarn install
-      - name: Bundle
+      - name: Bundle Browser
+        run: yarn bundle:browser
+      - name: Bundle Highlight
         run: yarn bundle:highlight
       - name: Confirm new version
         run: python3 compare.py

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@highlight-run/rrweb",
-  "version": "1.1.20",
+  "version": "1.2.0",
   "description": "record and replay the web",
   "scripts": {
     "test": "npm run bundle:browser && cross-env TS_NODE_CACHE=false TS_NODE_FILES=true mocha -r ts-node/register -r ignore-styles -r jsdom-global/register test/**.test.ts",
@@ -23,6 +23,7 @@
     "rrweb"
   ],
   "main": "dist/index.js",
+  "unpkg": "dist/rrweb.js",
   "sideEffects": false,
   "files": [
     "dist"
@@ -34,6 +35,7 @@
   },
   "homepage": "https://github.com/rrweb-io/rrweb#readme",
   "devDependencies": {
+    "@rollup/plugin-node-resolve": "^13.1.3",
     "@types/chai": "^4.1.6",
     "@types/inquirer": "0.0.43",
     "@types/jsdom": "^16.2.12",
@@ -60,7 +62,8 @@
     "rollup-plugin-postcss": "^3.1.1",
     "rollup-plugin-rename-node-modules": "^1.1.0",
     "rollup-plugin-terser": "^5.3.0",
-    "rollup-plugin-typescript": "^1.0.0",
+    "rollup-plugin-typescript2": "^0.31.2",
+    "rollup-plugin-web-worker-loader": "^1.6.1",
     "style-loader": "^2.0.0",
     "ts-loader": "^8.0.14",
     "ts-node": "^7.0.1",

diff --git a/rollup.config.js b/rollup.config.js
@@ -1,8 +1,9 @@
-import typescript from 'rollup-plugin-typescript';
-import resolve from 'rollup-plugin-node-resolve';
+import typescript from 'rollup-plugin-typescript2';
+import resolve from '@rollup/plugin-node-resolve';
 import { terser } from 'rollup-plugin-terser';
 import postcss from 'rollup-plugin-postcss';
 import renameNodeModules from 'rollup-plugin-rename-node-modules';
+import webWorkerLoader from 'rollup-plugin-web-worker-loader';
 import pkg from './package.json';
 
 function toRecordPath(path) {
@@ -13,20 +14,20 @@ function toRecordPath(path) {
 
 function toRecordPackPath(path) {
   return path
-    .replace(/^([\w]+)\//, '$1/record/')
-    .replace('rrweb', 'rrweb-record-pack');
+      .replace(/^([\w]+)\//, '$1/record/')
+      .replace('rrweb', 'rrweb-record-pack');
 }
 
 function toReplayPath(path) {
   return path
-    .replace(/^([\w]+)\//, '$1/replay/')
-    .replace('rrweb', 'rrweb-replay');
+      .replace(/^([\w]+)\//, '$1/replay/')
+      .replace('rrweb', 'rrweb-replay');
 }
 
 function toReplayUnpackPath(path) {
   return path
-    .replace(/^([\w]+)\//, '$1/replay/')
-    .replace('rrweb', 'rrweb-replay-unpack');
+      .replace(/^([\w]+)\//, '$1/replay/')
+      .replace('rrweb', 'rrweb-replay-unpack');
 }
 
 function toAllPath(path) {
@@ -35,16 +36,23 @@ function toAllPath(path) {
 
 function toPluginPath(pluginName, stage) {
   return (path) =>
-    path
-      .replace(/^([\w]+)\//, '$1/plugins/')
-      .replace('rrweb', `${pluginName}-${stage}`);
+      path
+          .replace(/^([\w]+)\//, '$1/plugins/')
+          .replace('rrweb', `${pluginName}-${stage}`);
 }
 
 function toMinPath(path) {
   return path.replace(/\.js$/, '.min.js');
 }
 
 const baseConfigs = [
+  // all in one
+  {
+    input: './src/entries/all.ts',
+    name: 'rrweb',
+    pathFn: toAllPath,
+    esm: true,
+  },
   // record only
   {
     input: './src/record/index.ts',
@@ -75,13 +83,6 @@ const baseConfigs = [
     name: 'rrweb',
     pathFn: (p) => p,
   },
-  // all in one
-  {
-    input: './src/entries/all.ts',
-    name: 'rrweb',
-    pathFn: toAllPath,
-    esm: true,
-  },
   // plugins
   {
     input: './src/plugins/console/record/index.ts',
@@ -93,17 +94,31 @@ const baseConfigs = [
     name: 'rrwebConsoleReplay',
     pathFn: toPluginPath('console', 'replay'),
   },
+  {
+    input: './src/plugins/sequential-id/record/index.ts',
+    name: 'rrwebSequentialIdRecord',
+    pathFn: toPluginPath('sequential-id', 'record'),
+  },
+  {
+    input: './src/plugins/sequential-id/replay/index.ts',
+    name: 'rrwebSequentialIdReplay',
+    pathFn: toPluginPath('sequential-id', 'replay'),
+  },
 ];
 
 let configs = [];
 
 for (const c of baseConfigs) {
-  const basePlugins = [resolve({ browser: true }), typescript()];
+  const basePlugins = [
+    resolve({ browser: true }),
+    webWorkerLoader(),
+    typescript({tsconfig: 'tsconfig.rollup.json'}),
+  ];
   const plugins = basePlugins.concat(
-    postcss({
-      extract: false,
-      inject: false,
-    }),
+      postcss({
+        extract: false,
+        inject: false,
+      }),
   );
   // browser
   configs.push({
@@ -121,12 +136,12 @@ for (const c of baseConfigs) {
   configs.push({
     input: c.input,
     plugins: basePlugins.concat(
-      postcss({
-        extract: true,
-        minimize: true,
-        sourceMap: true,
-      }),
-      terser(),
+        postcss({
+          extract: true,
+          minimize: true,
+          sourceMap: true,
+        }),
+        terser(),
     ),
     output: [
       {
@@ -184,7 +199,11 @@ if (process.env.BROWSER_ONLY) {
   for (const c of browserOnlyBaseConfigs) {
     const plugins = [
       resolve({ browser: true }),
-      typescript(),
+      webWorkerLoader(),
+      typescript({
+        outDir: null,
+        tsconfig: 'tsconfig.rollup.json'
+      }),
       postcss({
         extract: false,
         inject: false,
@@ -208,4 +227,4 @@ if (process.env.BROWSER_ONLY) {
   }
 }
 
-export default configs;
+export default configs;
diff --git a/tsconfig.json b/tsconfig.json
@@ -12,7 +12,7 @@
     "declarationDir": "dist",
     "lib": ["es6", "dom"],
     "downlevelIteration": true,
-    "declaration": true,
+    "declaration": true
   },
   "compileOnSave": true,
   "exclude": ["test"],

diff --git a/tsconfig.rollup.json b/tsconfig.rollup.json
@@ -0,0 +1,6 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "module": "ESNext"
+  }
+}