javascript - 通过 Core Erlang 将 Erlang 编译为 Javascript

标签 javascript compiler-construction erlang source-maps coreerlang

所以开始在 LuvvieScript 上取得进展,然后一切都在 Twitter 上开始了......
https://twitter.com/gordonguthrie/status/389659700741943296

安东尼·拉明 https://twitter.com/nokusu指出我做错了,我应该通过 Core Erlang 而不是 Erlang AST 从 Erlang 编译到 JavaScript。这对我来说既是一个引人注目但又没有吸引力的选择...... Twitter 不是该讨论的正确媒介,我想我会在这里写下来并就此获得一些建议。

战略概览

LuvvieScript 有三个核心要求:

  • 一个有效的 Erlang 子集,可以编译为相同且高性能的 Javascript
  • 一个完整的 Source Map,以便它可以在 LuvvieScript 而不是 Javascript 的浏览器中调试
  • 一个“运行时”客户端 javascript 环境(带有服务器端通信)来执行 LuvvieScript 模块(一种页面内管理器...)

  • 这些选项中的第三个有点超出本次辩论的范围,但前两个是核心。

    有一个懒惰的 gits 推论 - 我想使用尽可能多的 Erlang 和 Javascript 语法工具(词法分析器、解析器、标记器、AST 转换等)并编写最少的代码。

    当前思维

    代码目前的编写方式如下结构:
  • 将代码编译为 Erlang AST(有行号)
  • 标记代码(保留注释和空格)并使用这些标记构建一个字典,将行/列信息映射到标记
  • 合并字典和 AST 以给出一个 line/col AST(有些想对不同参数的 fns 进行分组)
  • 将这个新的 Erlang AST 转换为在 SpiderMonkey Parser 中实现的 Javascript AST
    API https://developer.mozilla.org/en-US/docs/SpiderMonkey/Parser_API
  • 使用像 Brushtail 这样的 Javascript 实用程序来改变 Javascript AST 中的尾调用 https://github.com/puffnfresh/brushtail
  • 使用像 ESCodeGen 这样的 Javascript 工具来发出 javascript https://github.com/Constellation/escodegen

  • 基本上我得到一个 Erlang AST,它看起来像这样:
     [{function,
          {19,{1,9}},
          atom1_fn,0,
          [{clause,
               {19,none},
               [],
               [[]],
               [{match,
                    {20,none},
                    [{var,{20,{5,6}},'D'}],
                    [{atom,{20,{11,15}},blue}]},
                {var,{21,{5,6}},'D'}]}]}]},
    

    然后我将它转换成一个 Javascript JSON AST,如下所示:
    {
        "type": "Program",
        "body": [
            {
                "type": "VariableDeclaration",
                "declarations": [
                    {
                        "type": "VariableDeclarator",
                        "id": {
                            "type": "Identifier",
                            "name": "answer",
                            "loc": {
                                "start": {
                                    "line": 2,
                                    "column": 4
                                },
                                "end": {
                                    "line": 2,
                                    "column": 10
                                }
                            }
                        },
                        "init": {
                            "type": "BinaryExpression",
                            "operator": "*",
                            "left": {
                                "type": "Literal",
                                "value": 6,
                                "raw": "6",
                                "loc": {
                                    "start": {
                                        "line": 2,
                                        "column": 13
                                    },
                                    "end": {
                                        "line": 2,
                                        "column": 14
                                    }
                                }
                            },
                            "right": {
                                "type": "Literal",
                                "value": 7,
                                "raw": "7",
                                "loc": {
                                    "start": {
                                        "line": 2,
                                        "column": 17
                                    },
                                    "end": {
                                        "line": 2,
                                        "column": 18
                                    }
                                }
                            },
                            "loc": {
                                "start": {
                                    "line": 2,
                                    "column": 13
                                },
                                "end": {
                                    "line": 2,
                                    "column": 18
                                }
                            }
                        },
                        "loc": {
                            "start": {
                                "line": 2,
                                "column": 4
                            },
                            "end": {
                                "line": 2,
                                "column": 18
                            }
                        }
                    }
                ],
                "kind": "var",
                "loc": {
                    "start": {
                        "line": 2,
                        "column": 0
                    },
                    "end": {
                        "line": 2,
                        "column": 19
                    }
                }
            }
        ],
        "loc": {
            "start": {
                "line": 2,
                "column": 0
              },
            "end": {
                "line": 2,
                "column": 19
               }
        }
    }
    

    问题报

    Anthony 的观点很好——Core Erlang 是一种比 Erlang 更简单、更规范的语言,应该比普通的 Erlang 更容易转换为 Javascript,但它没有很好的文档记录。

    我可以很容易地得到一个类似于 AST 的 Core Erlang 表示:
    {c_module,[],
        {c_literal,[],basic_types},
        [{c_var,[],{atom1_fn,0}},
         {c_var,[],{atom2_fn,0}},
         {c_var,[],{bish_fn,1}},
         {c_var,[],{boolean_fn,0}},
         {c_var,[],{float_fn,0}},
         {c_var,[],{int_fn,0}},
         {c_var,[],{module_info,0}},
         {c_var,[],{module_info,1}},
         {c_var,[],{string_fn,0}}],
        [],
        [{{c_var,[],{int_fn,0}},{c_fun,[],[],{c_literal,[],1}}},
         {{c_var,[],{float_fn,0}},{c_fun,[],[],{c_literal,[],2.3}}},
         {{c_var,[],{boolean_fn,0}},{c_fun,[],[],{c_literal,[],true}}},
         {{c_var,[],{atom1_fn,0}},{c_fun,[],[],{c_literal,[],blue}}},
         {{c_var,[],{atom2_fn,0}},{c_fun,[],[],{c_literal,[],'Blue 4 U'}}},
         {{c_var,[],{string_fn,0}},{c_fun,[],[],{c_literal,[],"string theory"}}},
         {{c_var,[],{bish_fn,1}},
          {c_fun,[],
              [{c_var,[],'_cor0'}],
              {c_case,[],
                  {c_var,[],'_cor0'},
                  [{c_clause,[],
                       [{c_literal,[],bash}],
                       {c_literal,[],true},
                       {c_literal,[],berk}},
                   {c_clause,[],
                       [{c_literal,[],bosh}],
                       {c_literal,[],true},
                       {c_literal,[],bork}},
                   {c_clause,
                       [compiler_generated],
                           [{c_var,[],'_cor1'}],
                       {c_literal,[],true},
                       {c_primop,[],
                           {c_literal,[],match_fail},
                           [{c_tuple,[],
                                [{c_literal,[],case_clause},
                                 {c_var,[],'_cor1'}]}]}}]}}},
         {{c_var,[],{module_info,0}},
          {c_fun,[],[],
              {c_call,[],
                  {c_literal,[],erlang},
                  {c_literal,[],get_module_info},
                  [{c_literal,[],basic_types}]}}},
         {{c_var,[],{module_info,1}},
          {c_fun,[],
              [{c_var,[],'_cor0'}],
              {c_call,[],
                  {c_literal,[],erlang},
                  {c_literal,[],get_module_info},
                  [{c_literal,[],basic_types},{c_var,[],'_cor0'}]}}}]}
    

    但没有线 col/nos。所以我可以得到一个可以生成 JS 的 AST - 但关键不是 SourceMaps。

    问题 1 我怎样才能得到我需要的行信息 - (我已经可以从“正常”的 Erlang token 中获取列信息......)

    Erlang Core 在生产过程中与普通 Erlang 略有不同,因为它开始将函数调用中的变量名替换为自己内部的变量名,这也会导致一些 Source Map 问题。一个例子是这个 Erlang 子句:
    bish_fn(A) ->
        case A of
            bash -> berk;
            bosh -> bork
        end.
    

    Erlang AST 很好地保留了名称:
     [{function,
          {31,{1,8}},
          bish_fn,1,
          [{clause,
               {31,none},
               [{var,{31,{11,12}},'A'}],
               [[]],
               [{'case',
                    {32,none},
                    [{var,{32,{11,12}},'A'}],
                    [{clause,
                         {33,none},
                         [{atom,{33,{9,13}},bash}],
                         [[]],
                         [{atom,{34,{13,17}},berk}]},
                     {clause,
                         {35,none},
                         [{atom,{35,{9,13}},bosh}],
                         [[]],
                         [{atom,{36,{13,17}},bork}]}]}]}]}]},
    

    Core Erlang 已经改变了函数中调用的参数的名称:
    'bish_fn'/1 =
        %% Line 30
        fun (_cor0) ->
        %% Line 31
        case _cor0 of
          %% Line 32
          <'bash'> when 'true' ->
              'berk'
          %% Line 33
          <'bosh'> when 'true' ->
              'bork'
          ( <_cor1> when 'true' ->
            primop 'match_fail'
                ({'case_clause',_cor1})
            -| ['compiler_generated'] )
        end
    

    问题 2 我可以在 Core Erlang 中保留或映射变量名称吗?

    问题 3 我很欣赏 Core Erlang 的明确设计,使编译变得容易 进入 Erlang 并编写改变 Erlang 代码的工具 - 但问题是它真的会成功
    更容易编译 Erlang的?

    选项

    我可以 fork 核心 erlang 代码并添加源映射选项,但我玩了 懒人卡在这里...

    更新

    针对 Eric 的回应,我应该澄清我是如何生成 Core Erlang cerl 记录的。我首先使用以下命令将我的普通 Erlang 编译为核心 erlang:
    c(some_module, to_core)
    

    然后我使用 core_scancore_parse在此功能中,来自 compiler.erl :
    compile(File) ->
        case file:read_file(File) of
            {ok,Bin} ->
                case core_scan:string(binary_to_list(Bin)) of
                    {ok,Toks,_} ->
                        case core_parse:parse(Toks) of
                            {ok, Mod} ->
                                {ok, Mod};
                            {error,E} ->
                                {error, {parse, E}}
                        end;
                    {error,E,_} ->
                        {error, {scan, E}}
                end;
            {error,E} ->
                {error,{read, E}}
        end.
    

    问题是我/怎样才能让该工具链发出带注释的 AST。我怀疑我需要自己添加这些选项:(

    最佳答案

  • 行号作为注释提供。如果您查看我真正推荐您使用的 cerl 模块,您会发现几乎所有内容都需要一个注释列表。其中一个注释是代表行号的简单数字。如果我没有直接记错 Core AST 并且 atom1_fn 变量在第 10 行。AST 将如下所示:
    {c_var,[10],{atom1_fn,0}}
  • 不,你必须自己做所有的簿记。没有什么可以为你做的。
  • 我不确定我是否理解这个问题。

  • Anthony 所说的关于 Core Erlang 的一切都是真实的。这也是我选择 Core Erlang 作为 Joxa 目标语言的相同原因。我从中学到的教训是,虽然 Core Erlang 是一种非常容易定位的目标语言,但它有两个主要缺点,建议不要使用它。
  • Dialyzer 仅适用于 Beam 文件的抽象代码块中的 Erlang AST。在编译为 Core Erlang 时,无法将这样的 AST 放入抽象代码块中。因此,如果您的目标是 Core Erlang,Dialyzer 将不适合您。无论您是否生成正确的规范属性,都是如此。
  • 你无法使用在 Erlang AST 上工作的工具。例如,编译为 Erlang 源代码的能力。 Core Erlang 与源代码编译器之间的问题非常多,根本无法正常工作。这是许多实用领域的重大胜利。

  • 由于上述原因,我实际上正在将 Joxa 重定向到 Erlang AST。
    顺便说一句,你可能对这个项目感兴趣。 https://github.com/5HT/shen .它是一个用于 Erlang AST 的 JavaScript 编译器,该编译器已经存在并且正在运行。虽然我没有太多的经验。
    ** 编辑:您实际上可以看到从 Erlang 源代码生成的核心 erlang AST。这在学习如何编译到核心时有很大帮助。 ec_compileerlware_commons repo 有很多实用函数来帮助解决这个问题。

    关于javascript - 通过 Core Erlang 将 Erlang 编译为 Javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19454247/

    相关文章:

    javascript - 如何阻止 JQuery 中的默认选项卡切换功能?

    objective-c - 警告 "Use of GNU statement expression extension"

    linux - 如何连接到已注册的节点 (Erlang) 并从另一个 Erlang 应用程序使用它

    javascript - Mozilla 附加组件首次运行时执行代码

    javascript - jQuery Validation Plugin : Invoke errorPlacement function when onfocusout, 键入并单击

    c++ - Tilera 交叉编译 - 链接错误

    java - 具有惰性评估的复杂结构翻译

    erlang - 如何通过 ID 获取 Erlang 端口?

    erlang - 跟踪 Erlang 函数 - 简写形式

    javascript - Angular nvd3 : Zooming on a line chart