andreyvit/json-diff

Browser issue when using vite

Sequoia opened this issue · 3 comments

Hi,

I'm using your library, it's great! There's an issue with some newer browser bundlers like vite, which don't like something about the colors.js library & blow up when I try to use json-diff.

It looks like the calls to colorize (the only link to colors.js) here and here are a passthrough; the CLI module calls colorize directly (not via the index module).

Would you be amenable to this file being split somehow so the main functionality (the diff function) could be imported from the browser without loading colorize?

Perhaps something like:

- lib/core.js
    - export diff
- lib/index.js
    - import diff from core
    - import colorize etc. from colorize
    - function diffString
    - export {diff, colorize, colorizeCallback, diffString } // preserve existing exports

Then a browser consumer like me could

import { diff } from 'json-diff/core'

and bypass the colorize/colors.js import. I think this would work. Does this sound alright if I can get it working?

Hello, @andreyvit
I have the same problem and you don't seem to respond to requests
Is it possible to include his changes?

I managed to get it working in my environment by setting the following configuration.
(Note: I use this with Cypress, so I'm not sure if this will work in other environments.)

import replace from '@rollup/plugin-replace';

export default defineConfig({
  plugins: [
    replace({
      'process.argv': JSON.stringify([]),
      'process.env': JSON.stringify({}),
    }),
  ],
});

I also had to add the following to the replace list (or alternatively, the vite define section) to make Cypress work

{ // ...
    'process.platform': '""',
    'process.stdout': JSON.stringify(false),
    'process.stderr': JSON.stringify(false),
}