react-native-bundle-visualizer: Source-map-explorer error

Hey folks,

I have pushed a fix, which reverts the minify flag introduced in PR.

If someone wants to help in testing, please remove the existing package and install it from the following command:

yarn add -D "https://github.com/IjzerenHein/react-native-bundle-visualizer.git#fix-remove-minify-false"

I tested this on the latest react-native: 0.71.6 and expo SDK: 48.0.10, and it works fine.

I have also added a troubleshooting section to use v3.1.3, if they encounter negative line error, which may appear in versions around >=0.70.0 & <=0.71.3.

Also, tested on RN64 and expo SDK 42, all green there as well.

I will be releasing a new version with this fix soon 🤞

react-native: 0.72.^ yahh i same issue, and we can comment line ‘–minify’, in /node_modules/react-native-bundle-visualizer/src/react-native-bundle-visualizer.js to solved.

const commands = [
  'bundle',
  '--platform',
  platform,
  '--dev',
  dev,
  '--entry-file',
  entryFile,
  '--bundle-output',
  bundleOutput,
  '--sourcemap-output',
  bundleOutputSourceMap,
  // '--minify',
  isExpo
];

Same here, no metro overrides, completely new project =(

Bundle is 4.75 MB in size (unchanged since last run)
=== error === {
  bundles: [],
  errors: [
    {
      bundleName: '/var/folders/24/31vn44z11c3b363x4p5pd6bw0000gp/T/react-native-bundle-visualizer/app/ios.bundle',
      code: 'InvalidMappingLine',
      message: 'Your source map refers to generated line 3, but the source only contains 2 line(s).\n' +
        'Check that you are using the correct source map.',
      error: [AppError]
    }
  ]
}

I installed this version as a dev dependency, and ran locally to fix

+    "react-native-bundle-visualizer": "3.1.0",

Add this line:

node_modules/react-native-bundle-visualizer/src/react-native-bundle-visualizer.js

return explore(
  {
    code: bundleOutput,
    map: bundleOutputSourceMap
  },
  {
    onlyMapped,
    noBorderChecks: true, // <----------- Add this line
    output: {
      format,
      filename: bundleOutputExplorerFile,
    },
  }
);

react-native-bundle-visualizer-npm-3.1.3-5b29b2c181.patch

Hey folks,

I have pushed a fix, which reverts the minify flag introduced in PR.

If someone wants to help in testing, please remove the existing package and install it from the following command:

yarn add -D "https://github.com/IjzerenHein/react-native-bundle-visualizer.git#fix-remove-minify-false"

I tested this on the latest react-native: 0.71.6 and expo SDK: 48.0.10, and it works fine.

I have also added a troubleshooting section to use v3.1.3, if they encounter negative line error, which may appear in versions around >=0.70.0 & <=0.71.3.

Also, tested on RN64 and expo SDK 42, all green there as well.

I will be releasing a new version with this fix soon 🤞

Works for me Thanks! 🥰🥰🏆

I installed this version as a dev dependency, and ran locally to fix

+    "react-native-bundle-visualizer": "3.1.0",

Not working

@nicolasburtey Thanks for the repro. I briefly took a look at that and looks like it’s probably related to how metro.config.js is overriden. I don’t have a clear explanation of the issue yet, I will try to look for details. Probably this could be related but need to dig further. I also tried putting minifierPath to metro-minify-uglify but it doesn’t seem to work.

I will try to comeback soon with an update. 👍

react-native: 0.72.^ yahh i same issue, and we can comment line ‘–minify’, in /node_modules/react-native-bundle-visualizer/src/react-native-bundle-visualizer.js to solved.

const commands = [
  'bundle',
  '--platform',
  platform,
  '--dev',
  dev,
  '--entry-file',
  entryFile,
  '--bundle-output',
  bundleOutput,
  '--sourcemap-output',
  bundleOutputSourceMap,
  // '--minify',
  isExpo
];

Confirm that this is working for react-native: 0.72.4 react-native-bundle-visualizer: 3.1.3

react-native: 0.72.^ yahh i same issue, and we can comment line ‘–minify’, in /node_modules/react-native-bundle-visualizer/src/react-native-bundle-visualizer.js to solved.

const commands = [
  'bundle',
  '--platform',
  platform,
  '--dev',
  dev,
  '--entry-file',
  entryFile,
  '--bundle-output',
  bundleOutput,
  '--sourcemap-output',
  bundleOutputSourceMap,
  // '--minify',
  isExpo
];

not work for Expo 49

I installed this version as a dev dependency, and ran locally to fix

+    "react-native-bundle-visualizer": "3.1.0",

You can also run npx react-native-bundle-visualizer@3.1.0. If you don’t want to save it as dev dependency.

@hurali97 thanks for looking into it some, I am not sure if that’s the only issue as it’s stated it started w/ RN 70 version but at least in my case my project is still on RN 68. I was able to work around the issue though as noted in my previous comment above.

Hi guys,

I have a few comments to discuss:

• The original issue was addressed in metro here.
• That fix was then updated in react-native-cli in 10.2.0 release here.
• Finally, the react-native-cli was updated here in the latest react-native version i.e: 0.71.4

I need some confirmation from the community, does latest react-native 0.71.4 works for you with latest react-native-bundle-visualizer 3.1.3 ?

I tried on my system and it works without any fuss.

So I will wait until I get some confirmations if that’s the case for others and then reverting the changes of setting minification to false in this PR, so that we benefit from minification while visualizing the bundles.

Hey folks,

Sorry for not being active. But I think I can devote some time to it now. I will be testing this on:

• react-native 0.71.3

Let’s see how far do I get in terms of investigating and then getting it fixed 🤞

@frankcalise thanks for the the comment. But I’m not sure I understand what should I do? The branch #fix-set-minify-to-false doesn’t exist anymore and my version of metro isn’t using terser as a minifier

This is probably related to this: https://github.com/IjzerenHein/react-native-bundle-visualizer/issues/116

Try this temp fix: https://github.com/IjzerenHein/react-native-bundle-visualizer/issues/116#issuecomment-1427042593

The latest metro has a fix for this issue. see the linked PR on the above issue here (although I don’t know what it means for in terms of a new release for this package)

@JHeigle @gabimoncha Can you guys tell are you using react-native cli or expo? Also the react-native-bundle-visualizer version that is being used.

I’m using react-native-cli and "react-native-bundle-visualizer": "^3.1.3"

seen the same issue. RN 0.71.2 and react-native-bundle-visualizer 3.1.3

tried with 3.1.0 and have a different error message, so it seems there is a difference in behavior between 3.1.0 and 3.1.3:

node:internal/process/promises:288
            triggerUncaughtException(err, true /* fromPromise */);
            ^

[UnhandledPromiseRejection: This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). The promise rejected with the reason "#<Object>".] {
  code: 'ERR_UNHANDLED_REJECTION'
}

ok I see 3.1.3 is supposed to fix RN 0.71 compatibility, I guess this is why I had different behavior. unfortunately seems none version works for me.

@hurali97 related repo if you want to try locally: https://github.com/GaloyMoney/galoy-mobile