Herramienta de compilación: proyecto Coffeescript/Node con componentes múltiples

Question

Estoy comenzando un proyecto en el trabajo y me preguntaba cuál sería la mejor herramienta de compilación para usar.

Todo está escrito en CoffeeScript, usando AngularJS para el lado del cliente y NodeJS para el servidor.

Hay varios componentes a la aplicación:

• Una aplicación IPAD
• Una aplicación para el iPhone (funcionalidad diferente del ipad)
• Un CMS para las aplicaciones de servidor
• Un NodeJS

Hay toneladas de código compartido entre todos estos, una vez más todos escritos en CoffeeScript.

Me gustaría una herramienta de compilación en la que pueda enumerar qué aplicación usa qué código (gran parte de él compartido) y compilaría los archivos javascript de cada aplicación en una carpeta separada.

Por ejemplo, configuraría una carpeta llamada '/ compiled/ipad /' que tiene index.html, y carpetas para js, css, img, etc. Haré una lista de los archivos de café compilados que quiero lanzar/compilar/ipad/js (parte de /src/shared/*.coffee, parte de /src/ipad/*.coffee, etc.) y qué archivos quiero arrojar en/compiled/ipad/css. Me gustaría que también pueda concatenar fácilmente archivos como yo quiera.

También compilaría mis pruebas, desde/src/test/ipad en/compiled/test /ipad/* .js.

Todas mis pruebas de la unidad del lado del cliente están escritas usando testacular y no estoy seguro de qué escribiré en las pruebas de la unidad del lado del servidor aún.

¿Qué herramienta/configuración de construcción es el mejor enfoque aquí? Un Makefile? Algo como Grunt? Sinceramente, soy nuevo en toda la escena de construcción.

editar: Decidido a ir con Browserify. Puede encontrar mi solución para que funcione con Angular aquí: https://groups.google.com/forum/#!topic/angular/ytoVaikOcCs

Answer 1

me gustaría poner todo el código compartido en Node.js módulos y crear un proyecto que se ve algo como lo siguiente:

Project 
|~apps/ 
| |~cms/ 
| | `-app.js 
| |~ipad/ 
| | `-app.js 
| |~iphone/ 
| | `-app.js 
| `~node/ 
| `-app.js 
|~libs/ 
| |-module.js 
| `-module2.js 
|~specs/ 
| |~cms/ 
| | `-app.js 
| |~ipad/ 
| | `-app.js 
| |~iphone/ 
| | `-app.js 
| `~node/ 
| `-app.js 
| `~libs/ 
| |-module.js 
| `-module2.js 
`-Makefile 

me permitiría usar algo como Browserify (hay otros) para hacer las aplicaciones del lado del cliente cuando sea necesario. De esa manera, en lugar de tener un archivo de compilación donde digas lo que necesitas, en realidad tienes aplicaciones reales que importan módulos.

Answer 2

Personalmente creo que la unidad para escribir el código del lado del servidor en javascript o coffeescript también se extiende a su cadena de herramientas de construcción: así que siga usando javascript/coffeescript allí también . Esto le permitirá automatizar fácilmente las tareas de su servidor/cliente desde su herramienta de compilación. Dudo que sea significativamente posible con otra herramienta como make (simplemente estaría escribiendo wrappers alrededor de las llamadas al comando node.js). Sugerencias, ordenados por estructurada-dad:

• node.js: Acaba de rodar sus scripts de construcción en javascript y invocarlos con el nodo. Similar a los guiones de shell, supongo. No recomiendo esta ruta.
• jake o cake: Soy del mundo de Java, por lo que no es sorprendente que estos me recuerden a la hormiga. Prefiero coffeescript, y de ahí prefiero pastel.
• grunt: No había oído hablar de esto antes, así que no puedo dar muchos consejos. Me recuerda a Maven, por supuesto ... y puedo decir que ... cuanto más estructura tiende a reforzar una herramienta de construcción, menos flexible puede ser. Es algo así como un intercambio. Siempre y cuando lo hagas, la herramienta de construcción te permitirá ahorrar toneladas de tiempo. Pero si tiene problemas específicos de la aplicación, puede ser un dolor real de resolver.

Por supuesto, usted puede ir con alguna otra herramienta de construcción que ya está familiarizado con la de algún otro idioma: rastrillo, Maven, hormiga, Gradle, etc, etc

Answer 3

Hice casi todo esto en un Cakefile usando módulos de nodo según sea necesario.

Establezca algunas variables globales que sean matrices con la ruta de cada archivo, concatenar esos archivos en un archivo en el directorio compilado que especifique, luego compile ese archivo en js.

Para los estilos, lo mismo con la concatenación sin la compilación, obviamente.

fs = require 'fs' 
path = require 'path' 
{spawn, exec} = require 'child_process' 
parser = require('uglify-js').parser 
uglify = require('uglify-js').uglify 
cleanCss = require 'clean-css' 

coffees = 
[ 
    "/src/shared/file1.coffee" 
    "/src/shared/file2.coffee" 
    "/src/ipad/file1.coffee" 
] 

tests = 
    [ 
    "/src/ipad/tests.coffee" 
    ] 

styles = 
[ 
    "/src/ipad/styles1.css" 
    "/src/shared/styles2.css" 
] 

concatenate = (destinationFile, files, type) -> 
    newContents = new Array 
    remaining = files.length 
    for file, index in files then do (file, index) -> 
     fs.readFile file, 'utf8', (err, fileContents) -> 
      throw err if err 
      newContents[index] = fileContents 
      if --remaining is 0 
       fs.writeFile destinationFile, newContents.join '\n\n', 'utf8', (err) -> 
       throw err if err 
       if type is 'styles' 
       minifyCss fileName 
       else 
       compileCoffee fileName 


compileCoffee = (file) -> 
    exec "coffee -C#{file}", (err) -> 
     throw err if err 
     # delete coffee file leaving only js 
     fs.unlink 'path/specifying/compiled_coffee', (err) -> 
      throw err if err 
      minifyJs file 

minifyJs = (file) -> 
    fs.readFile f, 'utf8', (err, contents) -> 
     ast = parser.parse contents 
     ast = uglify.ast_mangle ast 
     ast = uglify.ast_squeeze ast 
     minified = uglify.gen_code ast 

     writeMinified file, minified 

writeMinified = (file, contents) -> 
    fs.writeFile file, contents, 'utf8', (err) -> throw err if err 


minifyCss = (file) -> 
    fs.readFile file, 'utf8', (err, contents) -> 
    throw err if err 
    minimized = cleanCss.process contents 
    clean = minimized.replace 'app/assets', '' 

    fs.writeFile file, clean, 'utf8', (err) -> 
     throw err if err 


task 'compile_coffees', 'concat, compile, and minify coffees', -> 
    concatenate '/compiled/ipad/code.coffee', coffees, 'coffee' 

task 'concat_styles', 'concat and minify styles', -> 
    concatenate '/compiled/ipad/css/styles.css', styles, 'styles' 

task 'compile_tests', 'concat, compile, and minify test', -> 
    concatenate '/compiled/ipad/tests.coffee', tests, 'tests' 

Esto es más o menos lo que creo que estás pidiendo.

Definitivamente podría ser más bonito, especialmente teniendo una función separada para escribir los contenidos minificados, pero funciona.

No era perfecto para los estilos porque estaba usando Sass y tenía otras funciones antes de que tocara la función minimizada, pero creo que ya entendiste la idea.