前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >[工欲善其事|必先利其器]Emscripten1.39.4工具链的安装与简单使用/*WebAssembly从入门到放弃*/

[工欲善其事|必先利其器]Emscripten1.39.4工具链的安装与简单使用/*WebAssembly从入门到放弃*/

作者头像
周星星9527
发布2020-02-25 09:29:28
2K0
发布2020-02-25 09:29:28
举报

WebAssembly是什么?

WebAssembly是一种运行在现代网络浏览器中的新型代码,并且提供新的性能特性和效果。它设计的目的不是为了手写代码而是为诸如C、C++和Rust等低级源语言提供一个高效的编译目标。对于网络平台而言,这具有巨大的意义——这为客户端app提供了一种在网络平台以接近本地速度的方式运行多种语言编写的代码的方式;在这之前,客户端app是不可能做到的。而且,你在不知道如何编写WebAssembly代码的情况下就可以使用它。JavaScript框架不但可以使用WebAssembly获得巨大性能优势和新特性,而且还能使得各种功能保持对网络开发者的易用性。 https://developer.mozilla.org/zh-CN/docs/WebAssembly/Concepts

工具链配置Step by Step:(https://emscripten.org/docs/getting_started/downloads.html),可惜的是,如果按照改链接就能配置好开发环境,那么就不用费这么多文字了:

1.安装git工具后,确保git的bin文件夹在环境变量path下,执行命令行:

代码语言:javascript
复制
# Get the emsdk repo
git clone https://github.com/emscripten-core/emsdk.git

# Enter that directory
cd emsdk

2.安装openSSL,添加其bin目录到环境变量path中,然后在当前目录中执行如下命令:

代码语言:javascript
复制
# 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

其中emsdk install latest运行会报错解决方案就是安装openSSL,并添加其bin目录到环境变量path中。

安装过程命令行如下:

代码语言:javascript
复制
Microsoft Windows [版本 10.0.18363.592]
(c) 2019 Microsoft Corporation。保留所有权利。


C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk>emsdk update
You seem to have bootstrapped Emscripten SDK by cloning from GitHub. In this case, use "git pull" instead of "emsdk update" to update emsdk. (Not doing that automatically in case you have local changes)
Alternatively, use "emsdk update-tags" to refresh the latest list of tags from the different Git repositories.

C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk>git pull
There is no tracking information for the current branch.
Please specify which branch you want to merge with.
See git-pull(1) for details.

    git pull <remote> <branch>

If you wish to set tracking information for this branch you can do so with:

    git branch --set-upstream-to=origin/<branch> master


C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk>emsdk install --global latest
Installing SDK 'sdk-releases-upstream-967836071d96d9b7894e492382f5fcb96423fc07-64bit'..
Installing tool 'node-12.9.1-64bit'..
Error: Downloading URL 'https://storage.googleapis.com/webassembly/emscripten-releases-builds/deps/node-v12.9.1-win-x64.zip': <urlopen error unknown url type: https>
Warning: Possibly SSL/TLS issue. Update or install Python SSL root certificates (2048-bit or greater) supplied in Python folder or https://pypi.org/project/certifi/ and try again.
Installation failed!


C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk>emsdk install --global latest
Installing SDK 'sdk-releases-upstream-967836071d96d9b7894e492382f5fcb96423fc07-64bit'..
Installing tool 'node-12.9.1-64bit'..
Downloading: C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/zips/node-v12.9.1-win-x64.zip from https://storage.googleapis.com/webassembly/emscripten-releases-builds/deps/node-v12.9.1-win-x64.zip, 35200117 Bytes
Unpacking 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/zips/node-v12.9.1-win-x64.zip' to 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/node/12.9.1_64bit'
Done installing tool 'node-12.9.1-64bit'.
Installing tool 'python-2.7.13.1-64bit'..
Downloading: C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/zips/WinPython-64bit-2.7.13.1Zero.zip from https://storage.googleapis.com/webassembly/emscripten-releases-builds/deps/WinPython-64bit-2.7.13.1Zero.zip, 41285159 Bytes
Unpacking 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/zips/WinPython-64bit-2.7.13.1Zero.zip' to 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/python/2.7.13.1_64bit'
Done installing tool 'python-2.7.13.1-64bit'.
Installing tool 'java-8.152-64bit'..
Downloading: C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/zips/portable_jre_8_update_152_64bit.zip from https://storage.googleapis.com/webassembly/emscripten-releases-builds/deps/portable_jre_8_update_152_64bit.zip, 69241499 Bytes
Unpacking 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/zips/portable_jre_8_update_152_64bit.zip' to 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/java/8.152_64bit'
Done installing tool 'java-8.152-64bit'.
Installing tool 'releases-upstream-967836071d96d9b7894e492382f5fcb96423fc07-64bit'..
Downloading: C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/zips/967836071d96d9b7894e492382f5fcb96423fc07-wasm-binaries.zip from https://storage.googleapis.com/webassembly/emscripten-releases-builds/win/967836071d96d9b7894e492382f5fcb96423fc07/wasm-binaries.zip, 528244786 Bytes
Unpacking 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/zips/967836071d96d9b7894e492382f5fcb96423fc07-wasm-binaries.zip' to 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/upstream'
Done installing tool 'releases-upstream-967836071d96d9b7894e492382f5fcb96423fc07-64bit'.
up to date in 0.27s
Done installing SDK 'sdk-releases-upstream-967836071d96d9b7894e492382f5fcb96423fc07-64bit'.

C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk>emsdk activate latest
Writing .emscripten configuration file to user home directory C:\Users\assTeam/
The Emscripten configuration file C:\Users\assTeam\.emscripten has been rewritten with the following contents:

NODE_JS = 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/node/12.9.1_64bit/bin/node.exe'
PYTHON = 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/python/2.7.13.1_64bit/python-2.7.13.amd64/python.exe'
JAVA = 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/java/8.152_64bit/bin/java.exe'
LLVM_ROOT = 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/upstream/bin'
BINARYEN_ROOT = 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/upstream'
EMSCRIPTEN_ROOT = 'C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/upstream/emscripten'
TEMP_DIR = 'c:/users/songx/appdata/local/temp'
COMPILER_ENGINE = NODE_JS
JS_ENGINES = [NODE_JS]

Adding directories to PATH:
PATH += C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk
PATH += C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk\node\12.9.1_64bit\bin
PATH += C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk\python\2.7.13.1_64bit\python-2.7.13.amd64
PATH += C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk\java\8.152_64bit\bin
PATH += C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk\upstream\emscripten

Setting environment variables:
EMSDK = C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk
EM_CONFIG = C:\Users\assTeam\.emscripten
EMSDK_NODE = C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk\node\12.9.1_64bit\bin\node.exe
EMSDK_PYTHON = C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk\python\2.7.13.1_64bit\python-2.7.13.amd64\python.exe
JAVA_HOME = C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk\java\8.152_64bit


Set the following tools as active:
   node-12.9.1-64bit
   python-2.7.13.1-64bit
   java-8.152-64bit
   releases-upstream-967836071d96d9b7894e492382f5fcb96423fc07-64bit

The changes made to environment variables only apply to the currently running shell instance. Use the 'emsdk_env.bat' to re-enter this environment later, or if you'd like to permanently register this environment globally to all users in Windows Registry, rerun this command with the option --global.

C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk>emcc -v
emcc (Emscripten gcc/clang-like replacement + linker emulating GNU ld) 1.39.6
clang version 10.0.0 (Cswircachegitchromium.googlesource.com-external-github.com-llvm-llvm--project 06cfcdcca7de9c88a1e885eff0d0c4c07090ad48)
Target: x86_64-pc-windows-msvc
Thread model: posix
InstalledDir: C:\Users\ass\cache/projects/code/HTML/webAssembly/emsdk/upstream/bin
shared:INFO: (Emscripten: Running sanity checks)

编译实例代码(demo.c):

代码语言:javascript
复制
#include <stdio.h>

int main(int argc, char ** argv) {
    printf("WebAssembly module loaded successfully!\n");
}
// 返回2020
int test() {
    return 2020;
}

编译命令行(技术不到家,只能把源程序放在emsdk根目录下测试):

代码语言:javascript
复制
emcc demo.c -s WASM=1 -O3 -o demo.js

编译过程如下:

代码语言:javascript
复制
C:\Users\ass\cache\projects\code\HTML\webAssembly\emsdk>emcc demo.c -s WASM=1 -O3 -o demo.js
cache:INFO: generating system library: libcompiler_rt.a... (this will be cached in "C:\Users\assTeam\.emscripten_cache\wasm-obj\libcompiler_rt.a" for subsequent builds)
cache:INFO:  - ok
cache:INFO: generating system library: libc-wasm.a... (this will be cached in "C:\Users\assTeam\.emscripten_cache\wasm-obj\libc-wasm.a" for subsequent builds)
cache:INFO:  - ok
cache:INFO: generating system library: libdlmalloc.a... (this will be cached in "C:\Users\assTeam\.emscripten_cache\wasm-obj\libdlmalloc.a" for subsequent builds)
cache:INFO:  - ok
cache:INFO: generating system library: libpthread_stub.a... (this will be cached in "C:\Users\assTeam\.emscripten_cache\wasm-obj\libpthread_stub.a" for subsequent builds)
cache:INFO:  - ok
cache:INFO: generating system library: libc_rt_wasm.a... (this will be cached in "C:\Users\assTeam\.emscripten_cache\wasm-obj\libc_rt_wasm.a" for subsequent builds)
cache:INFO:  - ok
cache:INFO: generating system library: libsockets.a... (this will be cached in "C:\Users\assTeam\.emscripten_cache\wasm-obj\libsockets.a" for subsequent builds)
cache:INFO:  - ok

在同目录生成了demo.js和demo.wasm两个文件,wasm文件就是被编译成可供js调用的字节码文件。先到这里,以后有空再说如何在程序中加载wasm文件并执行其中的函数。

参考资料:

[1]https://segmentfault.com/a/1190000014208777

[2]https://emscripten.org/docs/getting_started/downloads.html

[3]https://github.com/emscripten-core/emsdk

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2020-02-03,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 传输过程数值模拟学习笔记 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档