

既存のJSライブラリをElmアプリから使うため、ネイティブモジュールでラッピングしました。しかし、最後のelm-makeでコケます。

[code]

    # 単体コンパイルをテストするコマンド。
    # 実際はwebpackとelm-webpack-loaderでコンパイルするようにセットアップしてある
    $ elm-make app/frontend/elm/Mermaid.elm
    I cannot find find module 'Native.Mermaid'.
    
    Module 'Mermaid' is trying to import it.
    
    Potential problems could be:
      * Misspelled the module name
      * Need to add a source directory or new dependency to elm-package.json
    
[/code]

ファイル配置:

[code]

    $ find app/frontend/elm/ -iname "Mermaid.*"
    app/frontend/elm//Mermaid.elm
    app/frontend/elm//Native/Mermaid.js
    
[/code]

中身: Mermaid.elm

[code]

    module Mermaid where
    {-| ...
    -}
    
    import Html exposing (Html)
    import Native.Mermaid
    
    ...
    
[/code]

中身: Native/Mermaid.js

[code]

    // setup
    Elm.Native = Elm.Native || {};
    Elm.Native.Mermaid = Elm.Native.Mermaid || {};
    
    // definition
    Elm.Native.Mermaid.make = function(localRuntime) {
      'use strict';
    
      if ('values' in Elm.Native.Mermaid) {
        return Elm.Native.Mermaid.values;
      }
    
      ...
    
      return Elm.Native.Mermaid.values = {
        toHtmlWith: F2(toHtmlWith)
      };
    };
    
[/code]

elm-markdownライブラリをほぼコピペしたようなものなのですが、どうすればコンパイルが通るようになるでしょうか


CC BY-SA 3.0
2016-01-15T10:28:13.063
20947
2017-04-30T09:02:38.167
2017-04-30T09:02:38.167
19110
30
question
javascript
Elmのネイティブモジュールが見つからないと言われる


ネイティブモジュールを含むパッケージは、そのことをelm-package.json内で明示する必要があります。

[code]

    ...
    "exposed-modules": [],
    "native-modules": true, // <---
    "dependencies": {
      ...
    
[/code]

これは、JavaScriptの世界はElmの型チェックが及ばず、副作用も起こし放題で危険なため、JavaScriptを含むパッケージを区別して扱えるようにするためです。ネイティブモジュールを含むパッケージは公式パッケージレポジトリにアップロードする際にレビューをはさむようにもなっています。


CC BY-SA 3.0
2016-01-15T10:28:13.063
20948
2016-01-15T10:28:13.063
30
20947
answer