9

コーヒースクリプトをシナトラで動作させようとしています。私は両方のテクノロジーに慣れていないので、これはおそらくばかげたことです。私の問題は、coffeescript が javascript にコンパイルされますが、ページ上で実行されず、代わりに html として表示されることです。

#sinatra app
require 'coffee-script'
get "/test.js" do
  coffee :hello
end

#hello.coffee
alert "hello world"

#My page (/test.js) doesn't execute the js - just displays the code

#On screen in the browser I get this:
   (function() {
  alert("hello world");
}).call(this);

#In the HTML I get this within the body tags

<pre style="word-wrap: break-word; white-space: pre-wrap;">(function() {
  alert('hello world!');
}).call(this);
</pre>
4

4 に答える 4

6

うーん...あなたの例はこの Sinatra documentationに基づいているようです。しかし、何らかの理由で、Sinatra は.jsファイルを HTML として提供しようとしており、それに応じて前処理しています。content_typeひょっとして、アプリケーションの他の場所に設定していませんか? コードを次のように変更してみてください

get "/test.js" do
  content_type "text/javascript"
  coffee :hello
end

Rack::CoffeeまたはBaristaを使用して、Rack レベルで CoffeeScript を JavaScript に自動的にコンパイルするという、まったく異なるアプローチを試すこともできます。いずれにせよ多数の CoffeeScript ファイルがある場合は、この方が簡単かもしれません。

編集：上記を投稿した後、おそらくあなたのマークアップを誤解しているだけだと思いました。test.jsブラウザでページを読み込んだときに表示されるものです

alert('hello world!');

? もしそうなら、すべてがうまくいっています。JavaScript は、<script>タグ間の HTML ページにある場合、または を介し​​て参照されている場合にのみ、ブラウザーで実行されます<script src="test.js"></script>。したがって、既存のコードに加えて、追加します

get "/alert", :provides => 'html' do
  '<script type=src="test.js"></script>'
end

alertブラウザでそのアドレスを開くと、スクリプトが実行されます。

于 2011-04-14T15:19:00.173 に答える
3

sinatra-coffee-script-templateから 、同じセットアップを探していました。

require 'rubygems'
require 'bundler/setup'
require 'sinatra'
require 'coffee-script'

get '/' do
  erb :index
end

get '/application.js' do
  coffee :application
end

次にapplication.coffeeで

$(document).ready ->
  $('button:first').click ->
    $('body').toggleClass 'dark', 'light'

index.erb

<h1>I'm living the dream</h1>
<button>Click me</button>

レイアウト.erb

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>Sinatra Coffee-Script Template</title>
  <style type="text/css">
    .dark {
      background: #2F2F2F;
      color: #7F7F7F;
    }
    .light {
      background: #EEEEEE;
      color: #2F2F2F;
    }
  </style>
</head>
<body>
  <%= yield %>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
  <script src="/javascripts/listeners.js" type="text/javascript"></script>
</body>
</html>
于 2011-06-01T19:08:17.293 に答える
2

私は通常、開発中に CoffeeScript ファイルにウォッチャーをセットアップしcoffee -wc dirname/、コンパイルされた JS ファイルを本番環境にデプロイします。理想的ではありませんが、いくつかの点でそれほど複雑ではなく、本番サーバー (私の場合は Heroku) から Node.JS への依存を取り除きます。

于 2011-04-15T11:10:00.787 に答える
0

sinatra-asset-snack ( https://rubygems.org/gems/sinatra-asset-snack ) のような gem を使用するか、ブートストラップを使用してプロジェクトを開始すると、すべての設定について心配する必要がなくなります。配管 ( https://github.com/benkitzelman/sinatra-backbone-bootstrap )

于 2013-03-29T07:54:01.590 に答える