Why can't external variables referenced in react see values in the debug environment?

scene

for example, I define a constant file, and in another component reference, it is clear that the constant works, but in the debug tool, why is the introduced constant value undefined,?

code

//constant.js
const Names={man:"zhangsan",woman:"xiaoli"}

export {Names}



//MyComponent.js
import {Names} from "./constant.js"

...

componentDidMount(){
debugger;
}

Action

Open the debugging tool. When you enter didMount, you can use the mouse to look at the value of Names. The undefined, prompt is undefined.
but it"s really okay to use it in your code.

is not just a constant, all import values are invisible.

Apr.07,2021

import {Names} from'. / constant.js'
step 1. During import, webpack calls the _ _ webpack_require__ method to put the module (constant) cache in installedModules, as shown in figure

constant.js

index.js constant_constant,Names_constant,Names referenceError

.

this applies to all module caches that import, will import, assigning values to new variables when used, and all imported methods or variables become an attribute of the new variable, so there is no scope

.

isn't it good to allocate memory space when needed to save space?
give it a try, and you can see the details by adding a console.log (Names), mouse.

the building owner problem can be simplified to: under the debugger, why the value of the following b is undefined.

; (function() {
    var b = 2; (function() {
        debugger
    })()

})()
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1eb147f-2347.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1eb147f-2347.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?