Cómo utilizar coffeescript con Sinatra

Estoy intentando que coffeescript trabaje con Sinatra. Soy nuevo en ambas tecnologías, así que esto es probablemente algo tonto. Mi problema parece ser que el coffeescript se compila en javascript pero no se ejecuta en la página, sino que aparece como html.Cómo utilizar coffeescript con Sinatra

#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>

Fuente

2011-04-14 Jack Kinsella

Cuando diga "En el HTML", ¿a qué HTML se refiere? ¿Cómo se incrustó tu JavaScript allí? Además, hay una inconsistencia por encima de '' hello world '' contra '' hello kids ''. –

Cuando digo "en el HTML" me refiero a cuando veo el origen de la página. Inconsistencia fijada: disculpa por cualquier confusión. –

Bien, lo entiendo, pero estoy preguntando: ¿Cómo creaste esa página al final de Sinatra? –

Hmm ... parece que su ejemplo se basa en this Sinatra documentation. Pero, por alguna razón, Sinatra está intentando servir el archivo .js como HTML, y lo está preprocesando en consecuencia. ¿Está por casualidad configurando content_type en otra parte de su aplicación? Trate de cambiar su código para

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

También podría intentar un enfoque completamente diferente, ya sea usando Rack::Coffee o Barista para compilar su CoffeeScript tener JavaScript de forma automática a nivel de rack. Eso podría ser más fácil si tiene una gran cantidad de archivos CoffeeScript de todos modos.

Editar: Después de publicar lo anterior, me sorprendió que probablemente estoy malinterpretando tu marcado. Es lo que se ve cuando se carga la página en su navegador test.js simplemente

alert('hello world!');

? Si es así, todo está funcionando bien. JavaScript solo se ejecutará en su navegador cuando se encuentre en una página HTML entre las etiquetas <script>, o se haga referencia a través de <script src="test.js"></script>. Así que además de su código existente, añadir

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

continuación, abra esa dirección alert en su navegador, y la secuencia de comandos debe ejecutarse.

Fuente

2011-04-14 15:19:00

Muchas gracias por su respuesta. Intenté ambas cosas, pero todavía no tuve suerte. Sin embargo, tienes razón al decir que no están en las etiquetas del guión.Agregué información adicional en la pregunta sobre lo que estoy viendo. Podría probar las soluciones de nivel de rack. –

Normalmente solo configuro un monitor en mis archivos CoffeeScript mientras desarrollo coffee -wc dirname/ y luego despliego los archivos compilados JS a la producción. No es lo ideal, pero es menos complicado en algunos aspectos y elimina la dependencia de Node.JS de mi servidor de producción (que en mi caso es Heroku.)

Fuente

2011-04-15 11:10:00

En realidad, la gema 'coffee-script' de Ruby (ahora un valor predeterminado en Rails 3.1) no depende de Node. Ejecuta el compilador de CoffeeScript (que es un archivo JavaScript) a través de [ExecJS] (https://github.com/sstephenson/execjs), que a su vez buscará el [therubyracer] (https://github.com/cowboyd/ geotextil) gema; es un intérprete de JavaScript sin dependencias. Totalmente amigable con Heroku. –

En particular, quiere [therubyracer-heroku] (https://github.com/aler/therubyracer-heroku). –

sí, esa gema es útil. no había escuchado cómo funcionaba antes, pero tiene mucho sentido ahora (precompilar coffeescript a javascript con un intérprete de javascript basado en ruby) –

De sinatra-coffee-script-template que solo estaba buscando para la misma configuración.

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

get '/' do 
    erb :index 
end 

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

entonces en application.coffee

$(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>

Fuente

2011-06-01 19:08:17

no mencionaste acerca de application.js en el index.erb o en layout.erb..how que sinatra lo lanzaría al navegador – coool

Utilice una joya como Sinatra-activo-bocado (https://rubygems.org/gems/sinatra-asset-snack) o incluso mejor, use un programa de arranque para inicie su proyecto para que no tenga que preocuparse por configurar todas las tuberías (https://github.com/benkitzelman/sinatra-backbone-bootstrap)

Fuente

2013-03-29 07:54:01 Ben

Cómo utilizar coffeescript con Sinatra

Respuesta

Cuestiones relacionadas