Chrome Javascript Sources转换导入模块名称

Question

In my original source code, I have

import myconst from '../utils/constants';
case myconst.XYZ:

However, in the Chrome Javascript source, I see the same converted as

case _myAppUtilsConstants['default'].XYZ:

It also says define(...) for the imported module

Is there some setting to prevent this conversion ?

Answer 1

Browsers don't currently support ES2016, so you use transpilers like Babel to convert ES2016 code into ES5 code. What you're seeing in Chrome is the generated ES5 code.

You can use source maps to tell Chrome how your original code relates to the code that runs inside Chrome.

For example, Babel has a sourceMaps option and Webpack can also generate a source map .

How this works specifically depends on the setup you are using to transpile your ES6 code.

You may have to enable source maps in Chrome first.