关于#vue.js#的问题：vue3项目调试显示代码

为什么.vue文件debugger出来直接是源代码呀，初学者求解

<template>
  <div id="app">
    <img src="./assets/logo.png">
  </div>

</template>

<script>
export default {
  name: 'App'
}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>

缺少外部引用

<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>

要是工程的话，需要安装vue，再根据情况写

• 关于该问题，我找了一篇非常好的博客，你可以看看是否有帮助，链接：vue如何debugger
• 除此之外, 这篇博客: vue:带有级别的日志工具， 可打包动态控制debug是否输出中的 测试 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  

• // 组件中
     debugLog(){
         this.$_debug(this.$store.state.logLevel, "rrrrrr", "cccc", "'cccccc")
         this.$_info("this is info")
         this.$_error("this is error")
         this.$_warn("this is error")
         // console.log()
     }