DEV Community

kyorohiro (kiyohiro kawamura)
kyorohiro (kiyohiro kawamura)

Posted on • Updated on

Dart and C : how to ffi and wasm (1) Env

In this article, I will explain about how to link Dartlang and Clang.
And, I will also explain that for not only with the server side, Android, iOS, Windows, and Linux, also with the web client.

By knowing this know-how, you can integrate functions written in system languages into your project across platforms.

(1) Develop Environment
(2) Hello World!!
(3) Int Double Pointer Buffer
(4) Pointer Buffer
(5) Structure Object

Dart and Native at dart:ffi

We can link any code written in the system language by to use dart:ffi.

https://dart.dev/guides/libraries/c-interop

So, If you want to link clang and dartlang code, you need to do following.
(1) Create shared library at Clang
(2) And Read it at Dart.

Dart and web assembly at dart:js

And We can link any code written in the system language by to use dart:js and WebAssembly in the web browser too.

https://developer.mozilla.org/en-US/docs/WebAssembly

So, If you want to link clang and dartlang code, that's what you need to do.
(1) Convert the code written in the system language to WebAssembly
(2) Read it at dart lang.

Create the develop environment

First time, I want to explain the develop environment for server side and browser.
And I decided to use Docker and Code-Server for this development environment.

I did the following

FROM ubuntu:20.04
ENV DEBIAN_FRONTEND noninteractive

# install vscode (code-server)
WORKDIR /works
COPY ./build_resource/code-server-3.0.0-linux-x86_64.tar.gz /works/code-server-3.0.0-linux-x86_64.tar.gz
RUN tar -xzf code-server-3.0.0-linux-x86_64.tar.gz -C ./ --strip-components 1
RUN /works/code-server --install-extension ms-vscode.cpptools

# install C
WORKDIR /works
RUN apt-get update
RUN apt-get install -y wget gnupg1
RUN apt-get install musl-dev -y
RUN apt-get install build-essential -y
RUN apt-get install cmake -y 
RUN apt-get install python3 -y
RUN apt-get install python3-pip -y
RUN ln -s `which pip3` /usr/bin/pip 
RUN ln -s `which python3` /usr/bin/python 

# install WebAssembly
WORKDIR /works/wasm
RUN apt-get install -y git
RUN git clone https://github.com/emscripten-core/emsdk.git

WORKDIR /works/wasm/emsdk
RUN ./emsdk install latest
RUN ./emsdk activate latest
#RUN source /works/wasm/emsdk/emsdk_env.sh --build=Release
ENV PATH=${PATH}:/works/wasm/emsdk:/works/wasm/emsdk/node/12.9.1_64bit/bin:/works/wasm/emsdk/upstream/emscripten
RUN apt install -y nodejs npm


# install Dart
RUN apt-get update
RUN apt-get install -y wget gnupg1
RUN apt-get install apt-transport-https
RUN sh -c 'wget -qO- https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add -'
RUN sh -c 'wget -qO- https://storage.googleapis.com/download.dartlang.org/linux/debian/dart_stable.list > /etc/apt/sources.list.d/dart_stable.list'
RUN apt-get update
RUN apt-get -y install dart
RUN /works/code-server --install-extension Dart-Code.dart-code

ENV PATH=${PATH}:/lib/dart/bin
ENV PATH="${PATH}:/root/.pub-cache/bin"


CMD ["/works/code-server", "--auth","none", "--host","0.0.0.0","--port","8443", "/app"]

Enter fullscreen mode Exit fullscreen mode

Specifically, it has the following configuration.
https://github.com/kyorohiro/dart_clang_codeserver/tree/01_env

$ docker-compose build 
$ docker-compose up -d
Enter fullscreen mode Exit fullscreen mode

After that, if you visit http://127.0.0.1:8443 in your browser, VSCode will open.

  • 127.0.0.1 depends on the environment

So, You can use 'emcc', 'gcc' and'dart ' in this environment.

Next time

We will try to link Dart and C using dart: ffi and dart: js

PS

This knowhow is got by developing follow package

https://github.com/kyorohiro/mbedtls_dart

Top comments (0)