빌드 도구 : 여러 구성 요소가있는 CoffeEScript / 노드 프로젝트

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

문제

나는 직장에서 프로젝트를 시작하고 사용하는 가장 좋은 빌드 도구가 무엇인지 궁금해하고 있습니다.

클라이언트 측 및 서버의 Nodejs의 Angularjs를 사용하여 CoffeEScript로 작성됩니다.

앱에 몇 가지 구성 요소가 있습니다.

  • iPad 앱
  • iPhone 앱 (iPad에서 다른 기능)
  • 앱의 CMS
  • 노드 js 서버

이 모든 것들 사이에 공유 된 코드가 다시 CoffeEScript로 작성되었습니다.

빌드 도구를 원하시는 분들을 원하고 있으며 각 앱을 사용하는 코드 (공유 대부분)를 나열하고 각 앱의 JavaScript 파일을 별도의 폴더에 빌드합니다.

예를 들어 index.html이있는 '/ compiled / ipad /'라는 폴더를 설정하고 JS, CSS, IMG 용 폴더를 설정합니다. IMG 등을 던진 컴파일 된 커피 파일을 나열합니다 / 컴파일 / ipad / js (/src/shared/*coffee의 일부, /src/ipad/*.coffee 등의 일부)와 내가 원하는 파일이 / 컴파일 된 / ipad / css에 던져있는 파일. 파일을 쉽게 연결하는 방법을 쉽게 연결할 수 있습니다.

또한 / src / test / ipad에서 / compiled / test / ipad / * js.

에서 내 테스트를 컴파일합니다.

모든 클라이언트 측 단위 테스트는 Testacular 를 사용하여 작성됩니다. 서버 측 단위 테스트를 아직 씁니다.

어떤 빌드 도구 / 구성이 가장 좋은 방법입니까? makefile? 멍청한 것 같아? 나는 솔직히 전체 빌드 장면에 새로운 것이 었습니다.

편집 : 브라우맨 화를 사용하기로 결정했습니다. https : // 그룹. google.com/forum/#ight/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를 사용하여 막대기도 있습니다. 이렇게하면 빌드 도구에서 서버 / 클라이언트 작업을 쉽게 자동화 할 수 있습니다. i 의도가있는 다른 도구와 같은 다른 도구로 의미가 불가능합니다 (node.js 명령 통화 주위에 래퍼를 작성하십시오). 체계적으로 주문 된 제안 :

  • nod.js : 빌드 스크립트를 굴리십시오. JavaScript에서 노드로 호출하십시오. 쉘 스크립트와 비슷하게, 나는 가정 해보고있다. 나는이 경로를 추천하지 않는다.
  • Jake 또는 케이크 : 나는 Java 세계에서 나와 있습니다. 그래서 이런 종류가 나에게 개미를 상기시켜줍니다. 나는 coffeescript를 선호하고, 따라서 케이크를 선호합니다.
  • rtrunt : 나는 이것에 대해 들어 본 적이 없었기 때문에 나는 많은 조언을 줄 수는 없다. 물론 Maven을 상기시켜줍니다 ... 그리고 나는 그냥 말할 수 있습니다 ... 더 많은 구조는 빌드 도구가 덜 유연하게 집행하는 경향이 있습니다. 그것의 무언가가 무언가를 벗어났다. 당신이하는 한 '빌드 도구'방식으로 시간을 절약 할 수 있습니다. 그러나 앱 특정 문제가있는 경우 해결하기 위해 하나의 왕실 통증이 될 수 있습니다.

물론, 당신은 당신이 이미 다른 언어로 익숙한 다른 빌드 도구와 함께 갈 수 있습니다 : 레이크, maven, 개미, 그라데 등등.

필요에 따라 노드 모듈을 사용하는 케이크 파일에서 거의 모든 것이 정확히있었습니다.

각 파일의 경로가있는 배열 인 일부 전역 변수를 설정하고 해당 파일을 지정한 컴파일 된 디렉토리의 파일에 연결 한 다음 해당 파일을 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