Domanda

Sto iniziando un progetto di lavoro e chiedevo qual'è il miglior tool di build da utilizzare sarebbe.

Il tutto è scritto in CoffeeScript, utilizzando AngularJS per il lato client e NodeJS per il server.

Ci sono parecchi componenti app:

  • Un'app per iPad
  • Un'app per iPhone (funzionalità diverse da ipad)
  • Un CMS per la app
  • Un NodeJS server

Ci sono tonnellate di codice condiviso tra tutti questi, di nuovo, tutto scritto in CoffeeScript.

Mi piacerebbe un tool di build dove posso elenco di app che utilizza il tipo di codice che è molto comune) e che sarebbe costruire ogni app file javascript in una cartella separata.

Per esempio, vorrei impostare una cartella chiamata '/compilato/ipad/' che ha index.html e le cartelle per js, css, img, etc.Vorrei fare un elenco di cosa compilato caffè file voglio gettato in /compilato/ipad/js (dal /src/shared/*.caffè, alcune delle quali provenienti da /src/ipad/*.caffè, ecc) e dai file che voglio gettato in /compilato/ipad/css.Vorrei essere facilmente in grado di concatenare i file come voglio, troppo.

Sarebbe anche compilare il mio test da /src/test/ipad /compilato/test/ipad/*.js.

Tutti i miei client-side unit test sono scritti utilizzando testacular e io non sono sicuro di quello che scriverò server-side unit test di sicurezza.

Quale strumento di creazione/configurazione è l'approccio migliore qui?Un Makefile?Qualcosa di simile a Grunt?Io sono onestamente nuovo a tutta la build scena.

modifica:Ha deciso di andare con Browserify.Potete trovare la mia soluzione per farlo funzionare con Angolare qui: https://groups.google.com/forum/#!argomento/angolare/ytoVaikOcCs

È stato utile?

Soluzione

Vorrei mettere tutto il codice condiviso in Node.js moduli e creare un progetto che sembra qualcosa di simile al seguente:

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

Vorrei quindi usare qualcosa come Browserify (ce ne sono altri) per rendere il lato client di applicazioni dove è necessario.In questo modo invece di avere un file di build in cui dici di che cosa avete bisogno è effettivamente reale apps importazione di moduli.

Altri suggerimenti

Personalmente credo che l'unità di scrivere codice server in javascript o coffeescript si estende per il vostro strumento di generazione catena:così bastone con l'utilizzo di javascript/coffeescript anche lì.Questo vi permetterà di automatizzare facilmente il vostro server/client attività dal tool di build - dubito che sarebbe significativamente possibile con un altro strumento come fare (devi solo essere iscritto wrapper intorno node.js comando chiama).Suggerimenti, ordinate per strutturata-ness:

  • node.js :Basta arrotolare il tuo script in javascript, e richiamarli con un nodo.Simile per gli script di shell, suppongo.Io non consiglio questo percorso.
  • jake o torta :Io vengo dal mondo java, quindi non è sorprendente che questi un pò mi ricordano ant.Io preferisco coffeescript, e quindi preferiscono torta.
  • grunt :Non avevo sentito parlare di questo prima, quindi non posso dare molti consigli.Mi ricorda maven, ovviamente...e posso solo dire...la struttura più uno strumento di creazione tende ad imporre il meno flessibile che può essere.Il suo qualcosa di un trade off.Come e 'lo strumento di generazione' modo è possibile risparmiare un sacco di tempo.Ma se si dispone di app di problemi specifici, può essere un dolore reale per risolvere.

Naturalmente, si può andare con qualche altro tool di build si conoscono già da qualche altra lingua:rake, maven, ant, gradle, etc etc.

Ho fatto quasi esattamente la cosa che tutti in un Cakefile utilizzando nodo moduli necessari.

Impostare alcune variabili globali che sono matrici con il percorso di ogni file, è possibile concatenare i file in un file compilato directory specificata, quindi compilare un file in js.

Per gli stili, la stessa cosa con la concatenazione senza la compilazione, ovviamente.

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'

Ora, questo è grosso modo quello che penso che stai chiedendo.

Potrebbe sicuramente essere più bella, soprattutto avendo una funzione separata per scrivere il minified contenuti, ma funziona.

Non è perfetto per gli stili sia perché stavo usando Sass e avevano altre funzioni prima di colpire la ridotta funzione, ma penso che si ottiene l'idea.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top