Как использовать coffeescript с Синатрой - PullRequest
Новая
       4

Как использовать coffeescript с Синатрой

8 голосов
/ 14 апреля 2011

Я пытаюсь заставить coffeescript работать с Синатрой. Я новичок в обеих технологиях, так что, наверное, это глупо. Моя проблема, кажется, в том, что coffeescript компилируется в javascript, но не выполняется на странице, а отображается как html. 

<code>#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);

Ответы [ 4 ]

6 голосов
/ 14 апреля 2011

Хмм ... похоже, ваш пример основан на этой документации Синатры . Но по какой-то причине Sinatra пытается использовать файл .js в качестве HTML и соответственно обрабатывает его. Вы случайно не устанавливаете content_type где-либо еще в своем приложении? Попробуйте изменить код на 

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

Вы также можете попробовать совершенно другой подход, используя Rack :: Coffee или Barista , чтобы автоматически компилировать ваш CoffeeScript в JavaScript на уровне стойки. В любом случае это может быть проще, если у вас есть большое количество файлов CoffeeScript.

Редактировать: После публикации вышесказанного, меня поразило, что я, вероятно, просто неверно истолковал вашу разметку. Это то, что вы видите, когда загружаете страницу test.js в браузере просто 

alert('hello world!');

? Если так, все работает нормально. JavaScript будет запускаться в вашем браузере только тогда, когда он находится на странице HTML между тегами <script> или ссылками через <script src="test.js"></script>. Поэтому в дополнение к существующему коду добавьте 

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

, затем откройте этот alert адрес в вашем браузере, и скрипт должен запуститься.

3 голосов
/ 01 июня 2011

От 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

тогда в приложении. Кофе 

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

index.erb 

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

layout.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>
2 голосов
/ 15 апреля 2011

Я обычно просто настраиваю наблюдателя на мои файлы CoffeeScript при разработке coffee -wc dirname/ и затем развертываю скомпилированные файлы JS в производство. Это не идеально, но в некоторых отношениях это менее сложно и убирает зависимость от Node.JS с моего рабочего сервера (в моем случае это Heroku.)

0 голосов
/ 29 марта 2013

Используйте драгоценный камень, такой как sinatra-asset-snack (https://rubygems.org/gems/sinatra-asset-snack) или даже лучше, используйте загрузчик, чтобы начать свой проект, чтобы вам не пришлось беспокоиться о настройке всей сантехники (https://github.com/benkitzelman/sinatra-backbone-bootstrap)

...