Getting this running on M2 Mac
Opened this issue · 0 comments
jwoertink commented
Hey, so I was curious to see how this works, and running in to some issues. I have a fresh Macbook Air M2
❯ crystal -v
Crystal 1.6.0 (2022-10-06)
LLVM: 14.0.6
Default target: aarch64-apple-darwin21.6.0
I started by just running the build.sh
in the lib (which seemed to work?)
❯ ./lib/js/scripts/build.sh src/main.cr
% Total % Received % Xferd Average Speed Time Time Time Current
Dload Upload Total Spent Left Speed
0 0 0 0 0 0 0 0 --:--:-- --:--:-- --:--:-- 0
100 1710k 100 1710k 0 0 1289k 0 0:00:01 0:00:01 --:--:-- 5594k
❯ php -S localhost:3001
[Sun Nov 6 15:13:34 2022] PHP 8.1.11 Development Server (http://localhost:3001) started
[Sun Nov 6 15:13:39 2022] [::1]:60077 Accepted
[Sun Nov 6 15:13:39 2022] [::1]:60077 [200]: GET /
[Sun Nov 6 15:13:39 2022] [::1]:60077 Closing
[Sun Nov 6 15:13:39 2022] [::1]:60078 Accepted
[Sun Nov 6 15:13:39 2022] [::1]:60078 [200]: GET /main.js
[Sun Nov 6 15:13:39 2022] [::1]:60078 Closing
[Sun Nov 6 15:13:39 2022] [::1]:60079 Accepted
[Sun Nov 6 15:13:39 2022] [::1]:60079 [200]: GET /main.wasm
When loading the index.html
I get this error
I wasn't sure if I missed a step, so I went back and ran shards build
which gives me this:
❯ shards build
Dependencies are satisfied
Building: main
Error target main failed to compile:
Undefined symbols for architecture arm64:
"___wasm_call_ctors", referenced from:
__start in _main.o
"__js1", referenced from:
_*Web::Window@JS::Reference#finalize:Nil in W-eb5858W-indow.o
_*JS::Console@JS::Reference#finalize:Nil in J-S-5858C-onsole.o
_*Web::HTMLDocument@JS::Reference#finalize:Nil in W-eb5858H-T-M-L-D-ocument.o
_*Web::HTMLCanvasElement@JS::Reference#finalize:Nil in W-eb5858H-T-M-L-C-anvasE-lement.o
_*Web::HTMLBodyElement@JS::Reference#finalize:Nil in W-eb5858H-T-M-L-B-odyE-lement.o
_*Web::CanvasContext@JS::Reference#finalize:Nil in W-eb5858C-anvasC-ontext.o
"__js55", referenced from:
_*JS::Console#log<String>:Nil in J-S-5858C-onsole.o
"__js56", referenced from:
_*Web::get_window:Web::Window in W-eb.o
"__js59", referenced from:
_*Web::HTMLBodyElement@Web::Node#append_child<Web::HTMLCanvasElement>:Nil in W-eb5858H-T-M-L-B-odyE-lement.o
"__js65", referenced from:
_*Web::CanvasContext#internal_setter_font<String>:Nil in W-eb5858C-anvasC-ontext.o
"__js66", referenced from:
_*Web::CanvasContext#fill_text<String, Int32, Int32>:Nil in W-eb5858C-anvasC-ontext.o
"__js68", referenced from:
_*Web::HTMLCanvasElement#get_context<String>:Web::CanvasContext in W-eb5858H-T-M-L-C-anvasE-lement.o
"__js70", referenced from:
_*Web::HTMLDocument#create_element<String>:Web::HTMLCanvasElement in W-eb5858H-T-M-L-D-ocument.o
"__js71", referenced from:
_*Web::HTMLDocument#body:Web::HTMLBodyElement in W-eb5858H-T-M-L-D-ocument.o
"__js73", referenced from:
_*Web::Window#console:JS::Console in W-eb5858W-indow.o
"__js74", referenced from:
_*Web::Window#document:Web::HTMLDocument in W-eb5858W-indow.o
"__js75", referenced from:
_*Web::Window#inner_width:Int32 in W-eb5858W-indow.o
"__js76", referenced from:
_*Web::Window#inner_height:Int32 in W-eb5858W-indow.o
ld: symbol(s) not found for architecture arm64
clang: error: linker command failed with exit code 1 (use -v to see invocation)
Error: execution of command failed with code: 1: `cc "${@}" -o /Users/jeremy/Development/crystal/crystal-wasm/bin/main -rdynamic -L/opt/homebrew/Cellar/crystal/1.6.0/libexec/../../../../lib -lgc -L/opt/homebrew/Cellar/libevent/2.1.12/lib -levent -liconv`
Then I tried adding the --release
flag to the script and got
❯ ./lib/js/scripts/build.sh src/main.cr --release
Please install wasm-opt
so, I'm not sure what I'm doing 😂
<!-- index.html -->
<html>
<head>
<script defer src="main.js"></script>
</head>
<body>
</body>
</html>
# src/main.cr
require "web"
window = Web.window
console = window.console
document = window.document
console.log "Width: #{window.inner_width}"
console.log "Height: #{window.inner_height}"
canvas = document.create_element("canvas")
document.body.append_child(canvas)
ctx = canvas.get_context("2d")
ctx.font = "30px Arial"
ctx.fill_text("Hello World!", 10, 30)