2016-10-02 8 views
0

コンポーネントを再利用できるようにriot.jsタグをプロジェクトに追加しようとしています。このアプリはNode + Express上で動作し、Pugをテンプレートとして使用します。Riot.jsコンパイラ/ 404タグが見つかりません

私は以下のページをレンダリングするルートを持っている:

include includes/header.pug 
link(rel="stylesheet" href="/styles/kaljasakot.css" type="text/css") 
body(id='bootstrap-override') 
    div(class='container-fluid') 
     div(class='header') 
      img(class='okklogo' src='img/okkimg.jpeg' height='80' width='130') 
      h1 Kaljasakot 
    kaljasakot 
    script(type="riot/tag" src="kaljasakot.tag") 
    script(src="https://cdn.jsdelivr.net/riot/2.6/riot+compiler.min.js") 
    script riot.mount('kaljasakot') 
    include includes/footer.pug 
    script(src='/js/kaljasakot.js') 

すなわち、私は暴動タグkaljasakotをPugテンプレートに載せようとしています。しかし、ブラウザはレンダリングページコンソールで404エラーを与える:

http://localhost:3001/kaljasakot.tag 404(見つかりません) 暴動+ compiler.min.js GET:2

を私が困惑少しですここでタグファイルはコンパイラが見つけるために置かなければならず、私はGoogleからこれに関するヒントを見つけることができません。誰かがこの事件に出くわしたのですか?

プロジェクト全体は、必要に応じてGithub linkにあります。

答えて

1

タグファイルは、Pugテンプレートのコンパイル時に取得されず、アプリケーションの実行中にブラウザから取得されます。 現時点では、Expressにタグファイルの場所を指定していません。

この問題を解決するには、たとえば、public/tagsというフォルダを作成し、そこにタグファイルを移動してscript(type="riot/tag" src="tags/kaljasakot.tag")のように使用します。 Expressは、publicフォルダを静的ファイルのソースとして設定しているため、そこからファイルを検索します。

ここでリクエストは404になりませんが、タグファイルもうまく機能しません。 タグファイルにPugを使用しているので、アプリケーションがそれらを使用する前に、それらをプリコンパイルする必要があります。上記のようにkaljasakot.tagをパブリックフォルダにドロップすると、RiotはPugの構文を理解できないため、エラーUncaught SyntaxError: Unexpected token =が表示されます。

タグファイルは、結局のところviewsフォルダに保存し、タグをコンパイルしてpublic/tagsフォルダに移動するビルドステップを設定するだけです。たとえば、Riot's documentation on server compilationおよびgulp-riotを参照してください。

+0

私は、ありがとう!私はあなたの助言の前に、事前コンパイルのドキュメントを読んでいない、これは働いた。 –

関連する問題