0

I'm developing a project in React and I'm importing functions from lodash and Immutable.js.

import isEqual from 'lodash/isEqual

const {List, Set, Map, is} = require('immutable')

When I'm debugging my code these functions work in the script but if I stop at a breakpoint and attempt to use them in Firefox's debugging console, I get a ReferenceError telling me they are not defined.

Do I need to explicitly import them in the console? Or am I importing them incorrectly?

  • variables in modules are not in the global scope - so, not accessible from console – Jaromanda X Jan 13 '20 at 22:32
  • So there's no way for me to debug with imported functions? – Tayler Cooper Jan 13 '20 at 22:38
  • 2
    I would've thought if the breakpoint was in the module you'd be able to access the currently scoped variables - you haven't made it clear where your breakpoint is – Jaromanda X Jan 13 '20 at 22:41
  • 1
    simplest way is to add what you want to window `window.isEqual = isEqual` – azium Jan 13 '20 at 22:42
  • @JaromandaX they're likely named something different than what's imported. it's possible to explore the vars in scope but that's annoying in my opinion. since it's for testing only, putting things on global scope is quick and easy – azium Jan 13 '20 at 22:43
  • `they're likely named something different` - unlikely – Jaromanda X Jan 13 '20 at 23:10

2 Answers2

0

I would recommend you to use Webpack to build your source files.

Once you are development mode please set your NODE_ENV to development.

You can also add mode: 'development' into your webpack.config.js file.

After you can use debugger; in anywhere in your code and when you run your code in the browser you can debug from that line.

For further reading: https://webpack.js.org/guides/development/#using-source-maps

hurricane
  • 6,521
  • 2
  • 34
  • 44
0

The variable names are not preserved during transpilation/minification/uglification process. Therefore you have to look for the changed variable name, to access them in the console.

You can find an in detail approach how to find out the real variable name here

henk
  • 2,677
  • 2
  • 18
  • 49