Environment:Ubuntu 16.06 + emscripten

URL: https://emscripten.org/docs/getting_started/downloads.html#linux

1. Installation emsdk

# Get the emsdk repo
git clone https://github.com/emscripten-core/emsdk.git # Enter that directory
cd emsdk # Fetch the latest version of the emsdk (not needed the first time you clone)
git pull # Download and install the latest SDK tools.
./emsdk install latest # Make the "latest" SDK "active" for the current user. (writes .emscripten file)
./emsdk activate latest # Activate PATH and other environment variables in the current terminal
source ./emsdk_env.sh

2.  Emsdk install targets

./emsdk install 1.38.45

3. Updating the SDK

# Fetch the latest registry of available tools.
./emsdk update # Download and install the latest SDK tools.
./emsdk install latest # Set up the compiler configuration to point to the "latest" SDK.
./emsdk activate latest # Activate PATH and other environment variables in the current terminal
source ./emsdk_env.sh

4. windows /cenos 7部署流程:

下载代码

git clone https://github.com/emscripten-core/emsdk.git
cd emsdk

安装依赖,添加环境变量

# 安装依赖项,这个过程比较长,会下载并自动安装node、Java、python等环境包,耐心等待
emsdk install latest //centos 环境: ./emsdk install latest
# 激活上一步下载的环境变量临时,一旦关闭cmd窗口,环境变量就失效了。
emsdk activate latest //centos 环境: ./emsdk activate latest # 把emsdk加到环境变量中,方便后续执行命令
emsdk_env.bat //centos 环境: source ./emsdk_env.sh

编译代码

#include <stdio.h>

int main() {
printf("hello world.");
return 0;
}

编译为js

emcc test.c

执行后,会在当前cmd所在目录下生成a.out.js 和 a.out.wasm

编译为html格式的demo文件

emcc test.c -s WASM=1 -o test.html

编译后产生如下文件:

将html文件发布到web容器中,或者使用下面命令发布(本文使用httpd)

python -m http.server
# 也可以使用下面的命令,直接打开默认浏览器运行
emrun test.html

本地浏览器访问http://192.168.1.126/test.html 显示如下:

WebAssembly环境搭建的更多相关文章

  1. qt for webassembly环境搭建图文教程

    一.前言 从Qt5.14开始,官方的在线安装提供了qt for webassembly构建套件,这对很多小白来说绝对是个好消息,也绝对是个好东西,好消息是不用再去交叉编译自己生成qt for weba ...

  2. .NET Core系列 : 1、.NET Core 环境搭建和命令行CLI入门

    2016年6月27日.NET Core & ASP.NET Core 1.0在Redhat峰会上正式发布,社区里涌现了很多文章,我也计划写个系列文章,原因是.NET Core的入门门槛相当高, ...

  3. Azure Service Fabric 开发环境搭建

    微服务体系结构是一种将服务器应用程序构建为一组小型服务的方法,每个服务都按自己的进程运行,并通过 HTTP 和 WebSocket 等协议相互通信.每个微服务都在特定的界定上下文(每服务)中实现特定的 ...

  4. rnandroid环境搭建

    react-native 环境搭建具体步骤这个大家已经玩烂了,这个主要是记录下来自己做win7系统遇到的坑 1.com.android.ddmlib.installexception 遇到这个问题,在 ...

  5. python开发环境搭建

    虽然网上有很多python开发环境搭建的文章,不过重复造轮子还是要的,记录一下过程,方便自己以后配置,也方便正在学习中的同事配置他们的环境. 1.准备好安装包 1)上python官网下载python运 ...

  6. springMVC初探--环境搭建和第一个HelloWorld简单项目

    注:此篇为学习springMVC时,做的笔记整理. MVC框架要做哪些事情? a,将url映射到java类,或者java类的方法上 b,封装用户提交的数据 c,处理请求->调用相关的业务处理—& ...

  7. 【定有惊喜】android程序员如何做自己的API接口?php与android的良好交互(附环境搭建),让前端数据动起来~

    一.写在前面 web开发有前端和后端之分,其实android还是有前端和后端之分.android开发就相当于手机app的前端,一般都是php+android或者jsp+android开发.androi ...

  8. Nexus(一)环境搭建

    昨天,成功搭建了自己的 Maven 环境(详见:Maven(一)环境搭建),今天就来研究和探讨下 Nexus 的搭建! 使用背景: 安装环境:Windows 10 -64位 JDK版本:1.7 Mav ...

  9. 「译」JUnit 5 系列:环境搭建

    原文地址:http://blog.codefx.org/libraries/junit-5-setup/ 原文日期:15, Feb, 2016 译文首发:Linesh 的博客:环境搭建 我的 Gith ...

随机推荐

  1. 【LeetCode】60. Permutation Sequence 解题报告(Python & C++)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 日期 题目地址:https://leetcode.c ...

  2. 教学日志:javaSE-初识java

    一.编译执行第一个java程序 /* 总结: 1.编译执行第一个java程序 步骤如下: 1.安装JDK开发环境: 2.配置环境变量,JAVA_HOME,PATH;--验证环境变量配置是否成功 jav ...

  3. JPEG原理详解 (转载)

    JPEG算法解密 by jinchao   图片压缩有多重要,可能很多人可能并没有一个直观上的认识,举个例子,一张800X800大小的普通图片,如果未经压缩,大概在1.7MB左右,这个体积如果存放文本 ...

  4. Essentially No Barriers in Neural Network Energy Landscape

    目录 梗概 主要内容 path的定义 path的逼近 Mechanical Model Nudged Elastic Band 局部最优 Draxler F, Veschgini K, Salmhof ...

  5. Java初学者作业——编写JAVA程序,计算跳水运动员本次动作的最终得分。

    返回本章节 返回作业目录 需求说明: 编写JAVA程序,计算跳水运动员本次动作的最终得分. 规则如下: 在跳水比赛中,共有六位裁判对运动员所完成的动作进行评分,每位裁判的评分在0-10之间,运动员最终 ...

  6. Java练习小题_求一个3*3矩阵对角线元素之和,矩阵的数据用行的形式输入到计算机中 程序分析:利用双重for循环控制输入二维数组,再将a[i][i]累加后输出。

    要求说明: 题目:求一个3*3矩阵对角线元素之和,矩阵的数据用行的形式输入到计算机中 程序分析:利用双重for循环控制输入二维数组,再将 a[i][i] 累加后输出. 实现思路: [二维数组]相关知识 ...

  7. js 盒子逐渐缓慢移动效果

    注释:可以用于盒子弹出,收回效果,比如:某东的产品详情页,侧边有购物车.优惠卷等,鼠标经过弹出效果 可以看这个网址使用案例:https://www.cnblogs.com/jq-growup/p/15 ...

  8. python+openpyxl 获取最大行数,不是真正想获取的行数,导致替换时,报”NoneType' object has no attribute 'find'

    问题描述: 使用excel对接口的数据进行管理,添加接口数据时,可能习惯性选择多行,设置了格式,导致多选了很多空行也被设置了格式,在读取这个sheet的最大行数时,发现有问题,获取到了为None的空行 ...

  9. js 将数字型 的字符串 转 数字 【整数 /浮点型数字】

    1. js 提供了两种可以将 数字型 的字符串 转 数字 的方法 parseInt()和parseFloat(), parseInt() 是转成整数, 但 向下去整数 , parseFloat() 是 ...

  10. spring cloud feign 报错 feign.FeignException$MethodNotAllowed: status 405 reading 解决

    1.前言 出现报错 feign.FeignException$MethodNotAllowed: status 405 reading XXXXX 需要检查 接口的请求参数是否一致 请求参数是否正确添 ...