Add node polyfills for pdfkit package in the browser

Author: carlobeltrame

packages/pdfkit/package.json

@@ -31,7 +31,8 @@
     "@babel/runtime": "^7.16.4",
     "@react-pdf/png-js": "^2.1.0",
     "crypto-js": "^4.0.0",
-    "fontkit": "^2.0.2"
+    "fontkit": "^2.0.2",
+    "vite-compatible-readable-stream": "^3.6.1"
   },
   "devDependencies": {
     "iconv-lite": "^0.4.13"

packages/pdfkit/rollup.config.js

@@ -4,7 +4,9 @@ import replace from '@rollup/plugin-replace';
 import nodeResolve from '@rollup/plugin-node-resolve';
 import { terser } from 'rollup-plugin-terser';
 import ignore from 'rollup-plugin-ignore';
-
+import alias from '@rollup/plugin-alias';
+import nodePolyfills from 'rollup-plugin-polyfill-node';
+import commonjs from '@rollup/plugin-commonjs';
 import pkg from './package.json';
 
 const cjs = {
@@ -19,6 +21,8 @@ const esm = {
 const getCJS = override => Object.assign({}, cjs, override);
 const getESM = override => Object.assign({}, esm, override);
 
+const input = 'src/index.js';
+
 const babelConfig = ({ browser }) => ({
   babelrc: false,
   exclude: 'node_modules/**',
@@ -38,79 +42,84 @@ const babelConfig = ({ browser }) => ({
   plugins: [['@babel/plugin-transform-runtime', { version: '^7.16.4' }]]
 });
 
-const configBase = {
-  input: 'src/index.js',
-  external: Object.keys(pkg.dependencies)
-    .map(dep => (dep === 'crypto-js' ? 'crypto-js/md5' : dep))
-    .concat(
-      '@babel/runtime/helpers/inheritsLoose',
-      '@babel/runtime/helpers/assertThisInitialized',
-      '@babel/runtime/helpers/createForOfIteratorHelperLoose',
-      '@babel/runtime/helpers/extends',
-      'stream',
-      'zlib'
-    ),
-  onwarn: (warning, rollupWarn) => {
-    if (warning.code !== 'CIRCULAR_DEPENDENCY') {
-      rollupWarn(warning);
+const getExternal = ({ browser }) => [
+  ...(Object.keys(pkg.dependencies)
+      .filter(dep => 'crypto-js' !== dep)
+      .filter(dep => !browser || 'vite-compatible-readable-stream' !== dep)
+  ),
+  'crypto-js/md5',
+  '@babel/runtime/helpers/inheritsLoose',
+  '@babel/runtime/helpers/assertThisInitialized',
+  '@babel/runtime/helpers/createForOfIteratorHelperLoose',
+  '@babel/runtime/helpers/extends',
+  'zlib',
+  ...(browser ? [] : ['fs']),
+];
+
+const getPlugins = ({ browser, minify = false }) => [
+  json(),
+  ...(browser ? [
+    ignore(['fs']),
+    alias({
+      entries: [
+        { find: 'stream', replacement: 'vite-compatible-readable-stream' },
+        { find: 'zlib', replacement: 'browserify-zlib' },
+      ]
+    }),
+    commonjs(),
+    nodeResolve({ browser, preferBuiltins: !browser }),
+    nodePolyfills({ include: [ /node_modules\/.+\.js/, /pdfkit\/src\/.*\.js/ ] }),
+  ] : [
+    nodeResolve({ browser, preferBuiltins: !browser }),
+  ]),
+  replace({
+    preventAssignment: true,
+    values: {
+      BROWSER: JSON.stringify(browser)
     }
-  }
-};
+  }),
+  babel(babelConfig({ browser })),
+  ...(minify ? [terser()] : []),
+];
 
-const serverConfig = Object.assign({}, configBase, {
+const serverConfig = {
+  input,
   output: [
     getESM({ file: 'lib/pdfkit.es.js' }),
     getCJS({ file: 'lib/pdfkit.cjs.js' })
   ],
-  plugins: [
-    json(),
-    nodeResolve(),
-    replace({
-      preventAssignment: true,
-      values: {
-        BROWSER: JSON.stringify(false)
-      }
-    }),
-    babel(babelConfig({ browser: false }))
-  ],
-  external: configBase.external.concat(['fs'])
-});
+  external: getExternal({ browser: false }),
+  plugins: getPlugins({ browser: false }),
+};
 
-const serverProdConfig = Object.assign({}, serverConfig, {
+const serverProdConfig = {
+  input,
   output: [
     getESM({ file: 'lib/pdfkit.es.min.js' }),
     getCJS({ file: 'lib/pdfkit.cjs.min.js' })
   ],
-  plugins: serverConfig.plugins.concat(terser())
-});
+  external: getExternal({ browser: false }),
+  plugins: getPlugins({ browser: false, minify: true }),
+};
 
-const browserConfig = Object.assign({}, configBase, {
+const browserConfig = {
+  input,
   output: [
     getESM({ file: 'lib/pdfkit.browser.es.js' }),
     getCJS({ file: 'lib/pdfkit.browser.cjs.js' })
   ],
-  plugins: [
-    ignore(['fs']),
-
-    json(),
-    nodeResolve(),
-
-    replace({
-      preventAssignment: true,
-      values: {
-        BROWSER: JSON.stringify(true)
-      }
-    }),
-    babel(babelConfig({ browser: true }))
-  ]
-});
+  external: getExternal({ browser: true }),
+  plugins: getPlugins({ browser: true }),
+};
 
 const browserProdConfig = Object.assign({}, browserConfig, {
+  input,
   output: [
     getESM({ file: 'lib/pdfkit.browser.es.min.js' }),
     getCJS({ file: 'lib/pdfkit.browser.cjs.min.js' })
   ],
-  plugins: browserConfig.plugins.concat(terser())
+  external: getExternal({ browser: true }),
+  plugins: getPlugins({ browser: true, minify: true }),
 });
 
 export default [

yarn.lock

@@ -10751,6 +10751,15 @@ verror@1.10.0:
     core-util-is "1.0.2"
     extsprintf "^1.2.0"
 
+vite-compatible-readable-stream@^3.6.1:
+  version "3.6.1"
+  resolved "https://registry.yarnpkg.com/vite-compatible-readable-stream/-/vite-compatible-readable-stream-3.6.1.tgz#27267aebbdc9893c0ddf65a421279cbb1e31d8cd"
+  integrity sha512-t20zYkrSf868+j/p31cRIGN28Phrjm3nRSLR2fyc2tiWi4cZGVdv68yNlwnIINTkMTmPoMiSlc0OadaO7DXZaQ==
+  dependencies:
+    inherits "^2.0.3"
+    string_decoder "^1.1.1"
+    util-deprecate "^1.0.1"
+
 w3c-hr-time@^1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz#0a89cdf5cc15822df9c360543676963e0cc308cd"