前端 - vue3编译过程的调试，怎么才能调试啊?
最近发现vue3在在mode为function和module下有时候编译的结果不一样。
于是想调试一下vue3的编译过程,特别是插值表达式中变量被替换为诸如ctx.aa这种的过程。
折腾了好久，发现只能调试mode为function时候的过程，在vite或者vue-cli项目中调试mode为module,但是到模版的编译时候，只能看见openBlock函数和setupBlock函数，但是看不见render函数的生成，也就是看不见编译中compile transform generate三个过程，不知道为啥。
有没有大佬在vite项目和vue-cli项目中能成功调试到编译过程的。
共有1个答案
在 Vue 3 中，你可以使用 source-map 来进行源码映射，以方便你在开发过程中进行调试。你可以通过以下步骤来开启 source-map：
- 在你的构建配置中，需要开启 source-map。如果你使用的是 Vite，可以在 vite.config.js 文件中添加如下配置：
export default defineConfig({ build: { sourceMap: true, },})如果你使用的是 Vue CLI，可以在项目的根目录下运行以下命令来生成 source-map：
vue-cli-service serve --source-map- 在你的浏览器中，需要开启 source-map。大部分现代浏览器都支持在开发者工具中查看 source-map。你只需要在开发者工具的 Sources 面板中点击 "Enable source maps" 按钮即可。
- 在你的代码中，添加一些用于调试的语句。例如，你可以在你的 Vue 组件中添加 console.log() 语句，以便在编译过程中输出一些调试信息。
- 当你运行你的应用时，浏览器的开发者工具会自动加载 source-map，并且将编译后的代码映射回原始代码。这样你就可以在开发者工具中查看和调试编译过程中的代码了。
注意：source-map 只适用于开发环境。在生产环境中，你需要关闭 source-map 以提高性能和安全性。
-
编译和运行 cd tb // make //编译 xt-run --turbo ./output/dsp.elf ./audio_data (或者make run)// 程序默认开启了aec算法，程序执行完后，你会看到目录 audio_data下多了一个 output.wav，这个是第0录mic经过aec后的音频输出。 gdb调试 修改 Makefile，将优化级别改成 -O0 xt-gdb -
-
编译和运行 cd tb // make //编译 xt-run --turbo ./output/dsp.elf ./audio_data // 程序默认开启了aec算法，程序执行完后，你会看到目录 audio_data下多了一个 output.wav，这个是第0录mic经过aec后的音频输出。 gdb调试 修改 Makefile，将优化级别改成 -O0 xt-gdb --args ./out
-
编译可调试的目标文件 为了使得编译出来的代码是能够被gdb这样的调试器调试，我们需要在使用gcc编译源文件的时候添加参数："-g"。这样编译出来的目标文件中才会包含可以用于调试器进行调试的相关符号信息。
-
本文向大家介绍平时是怎么调试JS的?相关面试题，主要包含被问及平时是怎么调试JS的?时的应答技巧和注意事项，需要的朋友参考一下 参考回答： 一般用Chrome自带的控制台
-
简单的策略调试可以在代码中使用Console.WriteLine()输出调试信息。如果需要高级调试功能可以通过Visual Studio来进行， OpenQuant的策略工程是一个标准的Visual Studio解决方案，可以使用Visual Studio打开、运行、调试OpenQuant的策略。需要注意的是由于运行环境的变化，当需要在Visual Studio中开发调试策略时要对策略项目配置进行
-
我试图创建一个编译时常量，这样R8就可以在最终的生产apk中省略调试代码。我遇到了一个路障，不可分配给。 进一步检查后，我发现用wrapper。 这里的问题是： 为什么不能将静态最终布尔值指定给常量值