Getting Source Maps to Work

[ScottPierce]

Environment

npx react-native info
info Fetching system and libraries information...
System:
    OS: macOS 10.15.4
    CPU: (12) x64 Intel(R) Core(TM) i9-8950HK CPU @ 2.90GHz
    Memory: 1.26 GB / 32.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 14.1.0 - /usr/local/bin/node
    Yarn: 1.10.1 - /usr/local/bin/yarn
    npm: 6.14.4 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  Managers:
    CocoaPods: 1.9.1 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: iOS 13.4, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2
    Android SDK:
      API Levels: 26, 27, 28, 29
      Build Tools: 26.0.2, 27.0.3, 28.0.3, 29.0.1, 29.0.2
      System Images: android-23 | Google APIs Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom, android-29 | Google Play Intel x86 Atom
      Android NDK: Not Found
  IDEs:
    Android Studio: 3.6 AI-192.7142.36.36.6392135
    Xcode: 11.4.1/11E503a - /usr/bin/xcodebuild
  Languages:
    Java: 1.8.0_211 - /usr/bin/javac
    Python: 2.7.17 - /usr/local/bin/python
  npmPackages:
    @react-native-community/cli: Not Found
    react: 16.11.0 => 16.11.0 
    react-native: 0.62.2 => 0.62.2 
  npmGlobalPackages:
    *react-native*: Not Found

Question

Hey! I have a few questions, and I was hoping someone could help me.

I created a branch of a small reproducer project here: https://github.com/ScottPierce/kotlin-react-native/tree/Haul2020

I'm checking source-map support with Haul, to consider moving over to it. I've got a simple Kotlin javascript module that just throws an exception, and I wanted to see if I can get a stack trace that references my Kotlin sources and line numbers. The compiled Kotlin JS files are located in the ./lib folder.

1. Why am I getting the same client exception for everything? Expected a string but was BEGIN_OBJECT

I'm getting a fairly useless stack-trace in the android client. I've gotten the same crash in the client for everything. Haul couldn't resolve the kotlin module, I got this exception. And I'm also seeing this exception when the client is throwing an exception.

Here is what I see:

React-native gives me a more useful exception, albeit without applying source-maps for some reason:

2. My stacktraces don't seem to take advantage of source-maps. How do I get them to?

3. How can I get webpack to see my local modules npm modules?

I'm following the instructions here: https://webpack.js.org/configuration/resolve/#resolvemodules

For some reason I can't get webpack to see and use the modules I have in my node_modules_local file. I've tried configuring it in my webpack.config.js and nothing seems to work. I've copied the modules into my node_modules directory for the time being which has allowed me to at least try and get this to work.

[zamotany]

Haul doesn't use webpack.config.js. So resolve.modules won't work unless you configure it in haul.config.js in transform. The error from 1st questions tells that the bundle is incorrect and it failed to load. The source-map-loader you applied in haul.config.js should do the job, if not, the support for the source maps from your kotlin lib is more of a Webpack problem and there's nothing magical in Haul to make that work.

[ScottPierce]

@zamotany Do you use webpack.haul.js?

[zamotany]

No, only haul.config.js is used by Haul.