docker Ubuntu wasm 环境配置 浏览器debug c/c++

简介: docker Ubuntu wasm 环境配置 浏览器debug c/c++

执行下面命令启动docker Ubuntu

docker container run -it -p 80:8000 ubuntu

进入Ubuntu容器中

root@6c76b77bfdb4:apt update
root@6c76b77bfdb4:apt install vim xz-utils bzip2 iputils-ping net-tools nginx cmake git python3.10
root@6c76b77bfdb4:update-alternatives --install /usr/bin/python python /usr/bin/python3.10 1
root@6c76b77bfdb4:mkdir /home/wasm
root@6c76b77bfdb4:cd /home/wasm
root@6c76b77bfdb4:git clone https://github.com/emscripten-core/emsdk.git
root@6c76b77bfdb4:cd emsdk/
root@6c76b77bfdb4:/home/wasm/emsdk# ./emsdk install latest
root@6c76b77bfdb4:/home/wasm/emsdk# ./emsdk activate latest
root@6c76b77bfdb4:/home/wasm/emsdk# source ./emsdk_env.sh
root@6c76b77bfdb4:/home/wasm/emsdk# mkdir -p /home/emsdk/test
root@6c76b77bfdb4:/home/wasm/emsdk# cd /home/emsdk/test
root@6c76b77bfdb4:/home/emsdk/test# vim hello .c
root@6c76b77bfdb4:echo "source /home/wasm/emsdk/emsdk_env.sh" >>~/.bashrc #省的以后都需要手动激活环境
emcc hello.c -o hello.html
emrun --no_browser --port 8000 hello.html

安装调试环境

在chrome了浏览器中输入 https://goo.gle/wasm-debugging-extension

在chrome浏览器中 安装 这个扩展

在检查-> 设置(Settings)->实验(Experiments)->过滤(Filter)中输入web

勾选 WebAssembly Debugging:Enable DWARF support 选项

重新编译

emcc -g test.c -fdebug-compilation-dir='.' -o test.html

设置完成之后刷新页面 在source里面即可看到test.c

使用光标点击test.c中的代码前面的行数那里之后既可以打断点如下图所示 给printf处打的断点

刷新页面之后如下图

点击如下图中按钮进行单步调试 之后 浏览器中会输出结果

结果1

结果2

目录
相关文章
|
1月前
|
IDE 编译器 项目管理
Dev-C++保姆级安装教程:Win10/Win11环境配置+避坑指南(附下载验证)
Dev-C++ 是一款专为 Windows 系统设计的轻量级 C/C++ 集成开发环境(IDE),内置 MinGW 编译器与调试器,支持代码高亮、项目管理等功能。4.9.9 版本作为经典稳定版,适合初学者和教学使用。本文详细介绍其安装流程、配置方法、功能验证及常见问题解决,同时提供进阶技巧和扩展学习资源,帮助用户快速上手并高效开发。
|
8月前
|
Ubuntu 开发工具 Android开发
Repo下载AOSP源码:基于ubuntu22.04 环境配置,android-12.0.0_r32
本文介绍了在基于Ubuntu 22.04的环境下配置Python 3.9、安装repo工具、下载和同步AOSP源码包以及处理repo同步错误的详细步骤。
521 0
Repo下载AOSP源码:基于ubuntu22.04 环境配置,android-12.0.0_r32
|
4月前
|
Ubuntu 开发工具 C++
Ubuntu 22.04上编译安装c++ libconfig library
通过本文的介绍,我们详细讲解了如何在Ubuntu 22.04上编译和安装libconfig库,并通过编写和运行一个简单的测试程序来验证安装是否成功。libconfig库的安装过程相对简单,主要包括环境准备、下载源码、编译和安装几个步骤。希望本文对您在项目中使用libconfig库有所帮助。
271 13
|
10月前
|
Ubuntu C++ Docker
Docker的基本指令和HTML/PYTHON/C++的简单创建示例
Docker的基本指令和HTML/PYTHON/C++的简单创建示例
|
6月前
|
Ubuntu Linux 编译器
Linux/Ubuntu下使用VS Code配置C/C++项目环境调用OpenCV
通过以上步骤,您已经成功在Ubuntu系统下的VS Code中配置了C/C++项目环境,并能够调用OpenCV库进行开发。请确保每一步都按照您的系统实际情况进行适当调整。
1307 3
|
9月前
|
Web App开发 Cloud Native 测试技术
云原生之使用Docker部署Firefox浏览器
【7月更文挑战第21天】云原生之使用Docker部署Firefox浏览器
357 3
|
10月前
|
机器学习/深度学习 Ubuntu Shell
深度学习环境配置(Ubuntu+Anaconda)
深度学习环境配置(Ubuntu+Anaconda)
189 3
|
11月前
|
并行计算 Shell Docker
【环境配置】Ubuntu16.04安装nvidia-docker
【环境配置】Ubuntu16.04安装nvidia-docker
276 2
|
11月前
|
算法 编译器 程序员
深入理解C++编译模式:了解Debug和Release的区别
深入理解C++编译模式:了解Debug和Release的区别
1602 3
|
11月前
|
Ubuntu 编译器 C++
【Conan 入门教程 】在Ubuntu上使用Conan编译C++第三方库:一站式解决方案
【Conan 入门教程 】在Ubuntu上使用Conan编译C++第三方库:一站式解决方案
2349 1
下一篇
oss创建bucket