chrome在调试通过webpack生成的捆绑javascript文件时不显示原始变量名

我使用此代码配置webpack 5：

const path = require('path');
module.exports = {
  entry: './src/index.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js',
  },
  devtool: "source-map"
};

这是我的index.js代码

const bar=require('./bar.js');
let a=1
console.log(a)
bar();

调试时，我无法访问名为“a”的变量

这是一个错误的网页？ 我记得几年前，当我与webpack的早期verison合作时，情况并非如此

无耻地抄袭（我自己的）评论

---

如果您查看已编译的捆绑包，您将看到原因-我猜在捆绑期间，webpack内联了

a

的值，并删除了

a

变量声明，如图像左侧

Scope>Local

下所示

---

您可以以不损坏标识符的方式使用webpack捆绑包—请查看，例如，

minimize:false

如果您查看已编译的捆绑包，您会发现原因-我猜在捆绑过程中，webpack内联了

a

的值，并删除了

a

变量声明，如Scope>Local左侧所示。@sdgluck感谢您的回复。让我检查捆绑文件。@sdgluck你说得对！谢谢那么，即使提供了源映射文件，也无法使用原始变量名调试Web包文件吗？我记得几年前我可以使用原始变量名进行调试。是的，您可以将其捆绑在一起，这样标识符就不会损坏-请查看上的可用选项，例如

minimize:false

。它可以工作！非常感谢！