iT邦幫忙

第 12 屆 iThome 鐵人賽

0
Software Development

30天 Lua重拾筆記系列 第 34

【30天Lua重拾筆記34】番外篇: Fengari - 一個JS實現的Lua,運行Lua在瀏覽器內吧!

  • 分享至 

  • xImage
  •  

幾年前關注過Moonshine和lua.vm.js,不過這兩個項目貌似沒什麼在更新了。Fengari這個這次到又是讓我為之一亮

Lua的實現真蠻多樣的,光是想讓Lua運行在瀏覽器就有不少,像是Moonshinelua.vm.jsStarlight。有些使用JS;也有些利用了WASM、emscripten。Fengari是屬於前者的實現,是JS實現的版本。其除了可以在瀏覽器執行外,也提供了基於Node.js的執行器。這是一個蠻新興的項目,整體設計粗淺看來也相當不錯而且完整,今天會略微介紹一下,但建議可以先閱讀閱讀為什麼我們使用JS重寫了Lua?(英文)

Fengari是希臘文「月亮」的意思

於瀏覽器執行Lua

將除了JS語言於瀏覽器執行的項目其實還不少。早期想跟JS打對台,直接由瀏覽器提供的VBScript,亦有新興瀏覽器實驗項目使用的Lisp;或是透過轉譯讓瀏覽器瞭解如何執行的Fengari,還有Google推出的Dart

與Dart.js類似,你需要先載入執行環境:

<script src='https://github.com/fengari-lua/fengari-web/releases/download/v0.1.4/fengari-web.js'></script>  

這邊使用了GitHub上Releases頁面的JS,你也可以直接下載後載入。這樣一來瀏覽器就可以理解怎麼處理application/lua

<script type="application/lua">
  print("hello world!")
</script>

就先很簡單的打印出hello world!你可以在console看到這段文字就表示瀏覽器已經了解怎麼處理script[type="application/lua"]。你也可以載入完整檔案:

<script src="/my-script.lua" type="application/lua" async></script>

CodePen: https://codepen.io/lagagain/pen/abNeZKK

使用瀏覽器API

透過這一系列,你應該有感受到Lua與JS有多相像。要使用Fengari去呼叫瀏覽器JS API寫起來非常自然,你可以透過js.global存取JS環境的globalThis,在瀏覽器就是window。要使用alertsetInteral等等API就非常容易。

local js = require "js"
local window = js.global

window:alert("Hello from Fengari!")

CodePen: https://codepen.io/lagagain/pen/zYqgBMj

在Node.js執行Lua

下載fengari-node-cli

npm install -g fengari-node-cli

執行fengari-cli

你也可以用fengari-cli取代lua來嘗試玩玩看本系列文章。

asciicast

Fengari相關子項目

也發表於個人網站


上一篇
30天Lua重拾筆記33】Java + Lua計算機
下一篇
【30天Lua重拾筆記35】完賽感想與延伸閱讀
系列文
30天 Lua重拾筆記36
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言