Создать инструмент: CoffeeScript / Node Project с несколькими компонентами

StackOverflow https://stackoverflow.com//questions/10689182

Вопрос

Я начинаю проект на работе и был задан вопросом, что будет наилучшим инструментом сборки.

Все это написано в CoffeeScript, используя AngularJS для клиентской стороны и NODEJS для сервера.

Есть несколько компонентов для приложения:

    .
  • приложение iPad
  • приложение для iPhone (другая функциональность от iPad)
  • CMS для приложений
  • nodejs сервер

Есть тонны общего кода между всеми этими, снова все написанные в CoffeeScript.

Я хотел бы, чтобы инструмент сборки, где я могу перечислить, какое приложение использует какой код (многое из него совместно), и он построит файлы JavaScript каждого приложения в отдельной папке.

Например, я бы настроил папку под названием «Compilet / iPad /», которая имеет index.html, а также папки для JS, CSS, IMG и т. Д. Я бы перечислил, какие скомпилированные файлы кофе я хочу бросить / компилировать / iPad / js (некоторые из него из /src/shared/*.coffee, некоторые из него из /src/ipad/*.Coffee и т. Д.) И какие файлы я хочу бросить / компилировать / iPad / CSS. Я хотел бы, чтобы это могло легко объединить файлы, как я тоже хочу.

Это также скомпилировало бы мои тесты, от / src / test / ipad в / compiced / test / iPad / *. js.

Все мои тесты на боковых клиентских модулях написаны с использованием testacular и я не уверен, что я ' пока напишу тесты на боковых объектах сервера.

Какой инструмент сборки / конфигурации здесь является лучшим подходом? Макияж? Что-то вроде хрунта? Я честно новичок в целой сцене сборки.

<Сильные> редактировать : решил пойти с браурией. Вы можете найти свое решение, чтобы сделать его работать с угловой частью: https:// группы. Google.com/forum/#!topic/angular/ytovaikoccs

Это было полезно?

Решение

Я бы поставил весь общий код в модули Node.js и создать проект, который выглядит что-то вроде следующего:

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
.

Я бы тогда использовал что-то вроде браузерификации (есть другие), чтобы заставить клиентские приложения, где это необходимо.Таким образом вместо того, чтобы иметь файл сборки, где вы говорите, что вам нужно, у вас на самом деле есть настоящие приложения, импортирующие модули.

Другие советы

Лично я думаю, что диск для записи бокового кода сервера в JavaScript или CoffeeScript проходит также в вашу цепочку для инструментов сборки: Так что придерживайтесь с помощью JavaScript / CoffeeScript. Это позволит вам легко автоматизировать ваши задачи сервера / клиента из вашего инструмента сборки - я сомневаюсь, что это было значимо возможным с другим инструментом, как Make (вы просто будете писать обертки вокруг командных вызовов Node.js). Предложения, заказанные структурированными нессоми:

    .
  • node.js : просто сверните сценарии сборки в JavaScript и вызывают их с узлом. Полагаю, сродни скрипты, я полагаю. Я не рекомендую этот маршрут.
  • Джейк или Торт : Я из мира Java, так что не удивительно, что эти вроде напоминают мне о муравьеде. Я предпочитаю CoffeeScript, и, следовательно, предпочитаю торт.
  • Grunt : Я не слышал об этом раньше, поэтому я не могу дать много советов. Это напоминает мне о Maven, конечно ... и я могу просто сказать ... Чем больше структурирует инструмент сборки, как правило, обеспечивает менее гибкое, что может быть. Это что-то от торговли. До тех пор, пока вы делаете это «инструмент сборки», как вы можете сохранить тонны времени. Но если у вас есть проблемы с приложением, это может быть одна королевская боль для разрешения.

Конечно, вы можете пойти с каким-либо другим инструментом сборки, с которым вы уже знакомы с какого-либо другого языка: грабли, Maven, Ant, Ridle, etc etc.

Я сделал почти это точное все в токе, используя модули узлов по мере необходимости.

Установите некоторые глобальные переменные, которые являются массивами с пути каждого файла, объединяют эти файлы в файл в скомпилированном каталоге, который вы указываете, а затем компилируйте, что один файл в JS.

Для стилей, то же самое с конкатенацией без компиляции, очевидно.

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'
.

Теперь это примерно то, что я думаю, вы просите.

Обязательно может быть красивее, особенно имея отдельную функцию для написания рамированного содержимого, но это работает.

Не идеально подходит для стилей либо потому, что я использовал SASS и имел другие функции, прежде чем он попал в министерную функцию, но я думаю, что вы получите идею.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top