同型のCycle.jsアプリケーションがサーバー上でレンダリングするときにxstream例外を引き起こすのはなぜですか？

デモ版isomorphic Cycle.js/Hapi.jsアプリを作成しようとしていますが、サーバでのレンダリング中にxstreamで例外が発生して失敗します。ここで何がうまくいかないのですか？私はCycle.js' isomorphic app exampleに私のアプリを基づいている。同型のCycle.jsアプリケーションがサーバー上でレンダリングするときにxstream例外を引き起こすのはなぜですか？

import Cycle from '@cycle/xstream-run' 
import xs from 'xstream' 
import {html, section, h1, p, head, title, body, div, script, makeHTMLDriver,} from '@cycle/dom' 
import serialize from 'serialize-javascript' 
import Logger from '@arve.knudsen/js-logger' 
let logger = Logger.get('server.rendering') 

let wrapVTreeWithHtmlBoilerplate = ([vtree, context,]) => { 
    return (
    html([ 
     head([ 
     title('Cycle Isomorphism Example'), 
     ]), 
     body([ 
     div('.app-container', [vtree,]), 
     script(`window.appContext = ${serialize(context)};`), 
     // script(clientBundle), 
     ]), 
    ]) 
); 
} 

let main = (sources) => { 
    let vtree = (
    section('.home', [ 
     h1('The homepage'), 
     p('Welcome to our spectacular web page with nothing special here.'), 
    ]) 
) 
    return { 
    DOM: vtree, 
    } 
} 

let renderIndex = (request, reply) => { 
    let context = xs.of({}) 
    Cycle.run((sources) => { 
    let vtree = main(sources).DOM 
    let wrappedVTree = xs.combine(vtree, context) 
     .map(wrapVTreeWithHtmlBoilerplate) 
     .last() 
    return { 
     DOM: wrappedVTree, 
    }; 
    }, { 
    DOM: makeHTMLDriver((html) => { 
     let wrappedHtml = `<!doctype html>${html}` 
    }), 
    context:() => {return context}, 
    PreventDefault:() => {}, 
    }) 
}

あなたは完全なソースコードhereを見つけることができます：

トレースバックは、次のようになります。次のように

TypeError: Uncaught error: s[i]._add is not a function 
    at CombineProducer._start (/Users/arve/Projects/hapi-cycle/node_modules/xstream/core.js:190:22) 
    at Stream._add (/Users/arve/Projects/hapi-cycle/node_modules/xstream/core.js:976:19) 
    at MapOperator._start (/Users/arve/Projects/hapi-cycle/node_modules/xstream/core.js:717:18) 
    at Stream._add (/Users/arve/Projects/hapi-cycle/node_modules/xstream/core.js:976:19) 
    at LastOperator._start (/Users/arve/Projects/hapi-cycle/node_modules/xstream/core.js:596:18) 
    at Stream._add (/Users/arve/Projects/hapi-cycle/node_modules/xstream/core.js:976:19) 
    at Stream.addListener (/Users/arve/Projects/hapi-cycle/node_modules/xstream/core.js:1050:14) 
    at Object.streamSubscribe (/Users/arve/Projects/hapi-cycle/node_modules/@cycle/xstream-adapter/lib/index.js:39:16) 
    at /Users/arve/Projects/hapi-cycle/node_modules/@cycle/base/lib/index.js:49:30 
    at Array.map (native)

レンダリングコードは基本的に見えます。

ノードv6.6.0、バベルノード6.14.0、Hapi 15.0.3、@ cycle/dom 12.2.5、@ cycle/xstream-run 3.1.0を使用してOS Xを実行しています。あなたがより多くの情報を必要とするかどうかを教えてください。

出典

2016-09-20 aknuds1

ローカル開発環境とサーバー環境のJS実行時間についての情報を個別に投稿してください。 –

@przemo_liそれは今のところすべてローカルですが、私は投稿します。 – aknuds1

@przemo_li完了。 – aknuds1

エラーの原因は、レンダリングされたVTreeがストリームではありませんでした。私は、次のコードを変更し、それが動作：

let vtree = sources.context.map(({}) => { 
    return (
    section('.home', [ 
     h1('The homepage'), 
     p('Welcome to our spectacular web page with nothing special here.'), 
    ]) 
) 
}) 
return { 
    DOM: vtree, 
}

（Iは、元同形例から借りた）sources.context.mapコールはvtreeがストリームであることを保証します。

出典

2016-09-20 12:21:52 aknuds1

同型のCycle.jsアプリケーションがサーバー上でレンダリングするときにxstream例外を引き起こすのはなぜですか？

答えて

関連する問題