Use rollup for inspector-monitor-trace-tab

packages/d3-state-visualizer/.babelrc

@@ -2,5 +2,6 @@
   "presets": [
     ["@babel/preset-env", { "targets": "defaults" }],
     "@babel/preset-typescript"
-  ]
+  ],
+  "plugins": ["@babel/plugin-transform-runtime"]
 }

packages/d3tooltip/.babelrc

@@ -2,5 +2,6 @@
   "presets": [
     ["@babel/preset-env", { "targets": "defaults" }],
     "@babel/preset-typescript"
-  ]
+  ],
+  "plugins": ["@babel/plugin-transform-runtime"]
 }

packages/map2tree/.babelrc

@@ -2,5 +2,6 @@
   "presets": [
     ["@babel/preset-env", { "targets": "defaults" }],
     "@babel/preset-typescript"
-  ]
+  ],
+  "plugins": ["@babel/plugin-transform-runtime"]
 }

packages/react-base16-styling/.babelrc

@@ -2,5 +2,6 @@
   "presets": [
     ["@babel/preset-env", { "targets": "defaults" }],
     "@babel/preset-typescript"
-  ]
+  ],
+  "plugins": ["@babel/plugin-transform-runtime"]
 }

packages/react-dock/.babelrc

@@ -3,5 +3,6 @@
     ["@babel/preset-env", { "targets": "defaults" }],
     "@babel/preset-react",
     "@babel/preset-typescript"
-  ]
+  ],
+  "plugins": ["@babel/plugin-transform-runtime"]
 }

packages/react-json-tree/.babelrc

@@ -3,5 +3,6 @@
     ["@babel/preset-env", { "targets": "defaults" }],
     "@babel/preset-react",
     "@babel/preset-typescript"
-  ]
+  ],
+  "plugins": ["@babel/plugin-transform-runtime"]
 }

packages/redux-devtools-chart-monitor/.babelrc

@@ -3,5 +3,6 @@
     ["@babel/preset-env", { "targets": "defaults" }],
     "@babel/preset-react",
     "@babel/preset-typescript"
-  ]
+  ],
+  "plugins": ["@babel/plugin-transform-runtime"]
 }

packages/redux-devtools-dock-monitor/.babelrc

@@ -3,5 +3,6 @@
     ["@babel/preset-env", { "targets": "defaults" }],
     "@babel/preset-react",
     "@babel/preset-typescript"
-  ]
+  ],
+  "plugins": ["@babel/plugin-transform-runtime"]
 }

packages/redux-devtools-inspector-monitor-trace-tab/.babelrc

@@ -1,6 +1,6 @@
 {
   "presets": [
-    "@babel/preset-env",
+    ["@babel/preset-env", { "targets": "defaults" }],
     "@babel/preset-react",
     "@babel/preset-typescript"
   ],

packages/redux-devtools-inspector-monitor-trace-tab/.eslintignore

@@ -1 +1 @@
-lib
+dist

packages/redux-devtools-inspector-monitor-trace-tab/.eslintrc.js

@@ -1,10 +1,14 @@
 module.exports = {
-  extends: '../../eslintrc.ts.react.base.json',
+  extends: '../../eslintrc.js.base.json',
-  parserOptions: {
-    tsconfigRootDir: __dirname,
-    project: ['./tsconfig.json'],
-  },
   overrides: [
+    {
+      files: ['*.ts', '*.tsx'],
+      extends: '../../eslintrc.ts.react.base.json',
+      parserOptions: {
+        tsconfigRootDir: __dirname,
+        project: ['./tsconfig.json'],
+      },
+    },
     {
       files: ['test/**/*.ts', 'test/**/*.tsx'],
       extends: '../../eslintrc.ts.react.jest.base.json',

packages/redux-devtools-inspector-monitor-trace-tab/README.md

@@ -9,11 +9,11 @@ It's integrated in Redux DevTools browser extension. To use it separately with [
 ```js
 import React from 'react';
 import { createDevTools } from '@redux-devtools/core';
-import InspectorMonitor from '@redux-devtools/inspector-monitor';
+import { InspectorMonitor } from '@redux-devtools/inspector-monitor';
-import TraceTab from '@redux-devtools/inspector-monitor-trace-tab';
+import { TraceTab } from '@redux-devtools/inspector-monitor-trace-tab';
 
 export default createDevTools(
-  <Inspector
+  <InspectorMonitor
     tabs: defaultTabs => [...defaultTabs, { name: 'Trace', component: TraceTab }]
   />
 );

packages/redux-devtools-inspector-monitor-trace-tab/package.json

@@ -11,14 +11,13 @@
   "files": [
     "lib"
   ],
-  "main": "lib/StackTraceTab.js",
+  "main": "dist/redux-devtools-inspector-monitor-trace-tab.cjs.js",
-  "types": "lib/StackTraceTab.d.ts",
+  "module": "dist/redux-devtools-inspector-monitor-trace-tab.esm.js",
+  "types": "dist/StackTraceTab.d.ts",
   "repository": "https://github.com/reduxjs/redux-devtools",
   "scripts": {
-    "build": "yarn run build:types && yarn run build:js",
+    "build": "rollup -c",
-    "build:types": "tsc --emitDeclarationOnly",
+    "clean": "rimraf dist",
-    "build:js": "babel src --out-dir lib --extensions \".ts,.tsx\" --source-maps inline",
-    "clean": "rimraf lib",
     "test": "jest",
     "lint": "eslint . --ext .ts,.tsx",
     "type-check": "tsc --noEmit",
@@ -31,23 +30,24 @@
     "@types/chrome": "^0.0.174",
     "anser": "^2.1.0",
     "html-entities": "^2.3.2",
-    "path-browserify": "^1.0.1",
     "redux-devtools-themes": "^1.0.0",
     "source-map": "^0.5.7"
   },
   "devDependencies": {
-    "@babel/cli": "^7.16.7",
     "@babel/core": "^7.16.7",
+    "@babel/eslint-parser": "^7.16.5",
     "@babel/plugin-transform-runtime": "^7.16.7",
     "@babel/preset-env": "^7.16.7",
     "@babel/preset-react": "^7.16.7",
     "@babel/preset-typescript": "^7.16.7",
     "@redux-devtools/core": "^3.9.2",
     "@redux-devtools/inspector-monitor": "^1.0.2",
+    "@rollup/plugin-babel": "^5.3.0",
     "@testing-library/react": "^12.1.2",
     "@types/babel__code-frame": "^7.0.3",
     "@types/html-entities": "^1.3.4",
     "@types/jest": "^27.4.0",
+    "@types/node": "^16.11.17",
     "@types/react": "^17.0.38",
     "@types/redux-devtools-themes": "^1.0.0",
     "@types/source-map": "0.5.2",
@@ -64,7 +64,11 @@
     "react-test-renderer": "^17.0.2",
     "redux": "^4.1.2",
     "rimraf": "^3.0.2",
+    "rollup": "^2.63.0",
+    "rollup-plugin-node-polyfills": "^0.2.1",
+    "rollup-plugin-typescript2": "^0.31.1",
     "ts-jest": "^27.1.2",
+    "tslib": "^2.3.1",
     "typescript": "~4.5.4"
   },
   "peerDependencies": {

packages/redux-devtools-inspector-monitor-trace-tab/rollup.config.js

@@ -0,0 +1,39 @@
+import typescript from 'rollup-plugin-typescript2';
+import babel from '@rollup/plugin-babel';
+import nodePolyfills from 'rollup-plugin-node-polyfills';
+
+const config = [
+  {
+    input: 'src/StackTraceTab.tsx',
+    output: [
+      {
+        file: 'dist/redux-devtools-inspector-monitor-trace-tab.cjs.js',
+        format: 'cjs',
+      },
+      {
+        file: 'dist/redux-devtools-inspector-monitor-trace-tab.esm.js',
+        format: 'esm',
+      },
+    ],
+    plugins: [
+      typescript(),
+      babel({
+        babelHelpers: 'runtime',
+        extensions: ['.ts', '.tsx'],
+        plugins: ['@babel/plugin-transform-runtime'],
+      }),
+      nodePolyfills(),
+    ],
+    external: [
+      /@babel\/runtime/,
+      'react',
+      'redux-devtools-themes',
+      'source-map',
+      '@babel/code-frame',
+      'anser',
+      'html-entities',
+    ],
+  },
+];
+
+export default config;

packages/redux-devtools-inspector-monitor-trace-tab/src/StackTraceTab.tsx

@@ -24,10 +24,10 @@ interface State {
   showDocsLink?: boolean;
 }
 
-export default class StackTraceTab<
+export class TraceTab<S, A extends Action<unknown>> extends Component<
-  S,
+  Props<S, A>,
-  A extends Action<unknown>
+  State
-> extends Component<Props<S, A>, State> {
+> {
   static defaultProps = {
     openFile,
   };

packages/redux-devtools-inspector-monitor-trace-tab/src/react-error-overlay/utils/unmapper.ts

@@ -5,10 +5,10 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import path from 'path';
 import StackFrame from './stack-frame';
 import { getSourceMap } from './getSourceMap';
 import { getLinesAround } from './getLinesAround';
-import path from 'path-browserify';
 
 function count(search: string, string: string): number {
   // Count starts at -1 becuse a do-while loop always runs at least once

packages/redux-devtools/.babelrc

@@ -3,5 +3,6 @@
     ["@babel/preset-env", { "targets": "defaults" }],
     "@babel/preset-react",
     "@babel/preset-typescript"
-  ]
+  ],
+  "plugins": ["@babel/plugin-transform-runtime"]
 }

yarn.lock

@@ -4883,9 +4883,9 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@redux-devtools/inspector-monitor-trace-tab@workspace:packages/redux-devtools-inspector-monitor-trace-tab"
   dependencies:
-    "@babel/cli": ^7.16.7
     "@babel/code-frame": ^7.16.7
     "@babel/core": ^7.16.7
+    "@babel/eslint-parser": ^7.16.5
     "@babel/plugin-transform-runtime": ^7.16.7
     "@babel/preset-env": ^7.16.7
     "@babel/preset-react": ^7.16.7
@@ -4893,11 +4893,13 @@ __metadata:
     "@babel/runtime": ^7.16.7
     "@redux-devtools/core": ^3.9.2
     "@redux-devtools/inspector-monitor": ^1.0.2
+    "@rollup/plugin-babel": ^5.3.0
     "@testing-library/react": ^12.1.2
     "@types/babel__code-frame": ^7.0.3
     "@types/chrome": ^0.0.174
     "@types/html-entities": ^1.3.4
     "@types/jest": ^27.4.0
+    "@types/node": ^16.11.17
     "@types/react": ^17.0.38
     "@types/redux-devtools-themes": ^1.0.0
     "@types/source-map": 0.5.2
@@ -4911,15 +4913,18 @@ __metadata:
     eslint-plugin-react-hooks: ^4.3.0
     html-entities: ^2.3.2
     jest: ^27.4.5
-    path-browserify: ^1.0.1
     react: ^17.0.2
     react-dom: ^17.0.2
     react-test-renderer: ^17.0.2
     redux: ^4.1.2
     redux-devtools-themes: ^1.0.0
     rimraf: ^3.0.2
+    rollup: ^2.63.0
+    rollup-plugin-node-polyfills: ^0.2.1
+    rollup-plugin-typescript2: ^0.31.1
     source-map: ^0.5.7
     ts-jest: ^27.1.2
+    tslib: ^2.3.1
     typescript: ~4.5.4
   peerDependencies:
     "@redux-devtools/inspector-monitor": ^1.0.0
@@ -14116,6 +14121,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"estree-walker@npm:^0.6.1":
+  version: 0.6.1
+  resolution: "estree-walker@npm:0.6.1"
+  checksum: 9d6f82a4921f11eec18f8089fb3cce6e53bcf45a8e545c42a2674d02d055fb30f25f90495f8be60803df6c39680c80dcee7f944526867eb7aa1fc9254883b23d
+  languageName: node
+  linkType: hard
+
 "estree-walker@npm:^1.0.1":
   version: 1.0.1
   resolution: "estree-walker@npm:1.0.1"
@@ -19941,7 +19953,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"magic-string@npm:^0.25.7":
+"magic-string@npm:^0.25.3, magic-string@npm:^0.25.7":
   version: 0.25.7
   resolution: "magic-string@npm:0.25.7"
   dependencies:
@@ -25732,6 +25744,26 @@ __metadata:
   languageName: node
   linkType: hard
 
+"rollup-plugin-inject@npm:^3.0.0":
+  version: 3.0.2
+  resolution: "rollup-plugin-inject@npm:3.0.2"
+  dependencies:
+    estree-walker: ^0.6.1
+    magic-string: ^0.25.3
+    rollup-pluginutils: ^2.8.1
+  checksum: a014972c80fe34b8c8154056fa2533a8440066a31de831e3793fc21b15d108d92c22d8f7f472397bd5783d7c5e04d8cbf112fb72c5a26e997726e4eb090edad1
+  languageName: node
+  linkType: hard
+
+"rollup-plugin-node-polyfills@npm:^0.2.1":
+  version: 0.2.1
+  resolution: "rollup-plugin-node-polyfills@npm:0.2.1"
+  dependencies:
+    rollup-plugin-inject: ^3.0.0
+  checksum: e84645212c443aca3cfae2ba69f01c6d8c5c250f0bf651416b69a4572b60aae9da7cdd687de3ab9b903f7a1ab96b06b71f0c4927d1b02a37485360d2b563937b
+  languageName: node
+  linkType: hard
+
 "rollup-plugin-terser@npm:^7.0.2":
   version: 7.0.2
   resolution: "rollup-plugin-terser@npm:7.0.2"
@@ -25763,6 +25795,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"rollup-pluginutils@npm:^2.8.1":
+  version: 2.8.2
+  resolution: "rollup-pluginutils@npm:2.8.2"
+  dependencies:
+    estree-walker: ^0.6.1
+  checksum: 339fdf866d8f4ff6e408fa274c0525412f7edb01dc46b5ccda51f575b7e0d20ad72965773376fb5db95a77a7fcfcab97bf841ec08dbadf5d6b08af02b7a2cf5e
+  languageName: node
+  linkType: hard
+
 "rollup@npm:^2.63.0":
   version: 2.63.0
   resolution: "rollup@npm:2.63.0"