11

バックエンドに Django、フロントエンドに Backbone を使用してハイブリッド Web アプリケーションを構築しています。

構造は次のとおりです: Django テンプレートですべての HTML を生成し、request.is_ajax返すテンプレートを決定するために使用し、必要に応じて Backbone を使用して HTML を取り込みます (非 JavaScript ユーザーをサポートしたいので、これを行います)。

とにかく、私の質問はこれです。私の JavaScript コードがより複雑になるにつれて、次のことを自動的に実行できるようにしたいと考えています。

  • 非同期 JavaScript 読み込み
  • CSS ファイルの連結と縮小
  • JavaScript ファイルの連結と縮小
  • JSリンティング

画像の最適化やパッケージ管理についてはあまり心配していません。これは私が持っているセットアップで可能ですか？現在、標準の Django アプリです。

/media
  /js
    main.js <-- Backbone code is in here
    /plugins
      backbone.js
      underscore.js
  /css
    main.css 
    results.css
  /img
/myapp
  admin.py
  models.py
  views.py
/templates
  /myapp
    index.html <-- references to all JS and CSS files here

Yeoman (または単にgrunt ) またはBrunchを使用する必要があるかどうか、またはより簡単な方法があるかどうかはわかりません。私が使用するものは何でも、それをjsディレクトリにドロップするだけでよいのか、それともテンプレートの場所が複雑になるのかはわかりません。

現在、require.js を使用して JS を非同期にロードする方法は知っていますが、連結やリントなどの方法がわからないため、ツールを探しています。多分私はシェルスクリプトを書くべきです:)

4

2 に答える 2

8

ブランチから始めることをお勧めします。ブランチは、プラグインが500行のコードgruntfileを記述しなくても、すぐに使用できるので、gruntよりも単純です。また、はるかに高速で、アプリの再コンパイルが即座に行われます。

セットアップは次のようになります

public/         # The directory with static files which is generated by brunch.
  app.js        # Ready to be served via webserver.
  app.css       # Don’t change it directly, just run `brunch watch --server`.
  assets/       # And then all changed files in your app dir will be compiled.
    images/

frontend/       # Main brunch application directory. Configurable, of course.
  app/          # Your code will reside here.
    assets/     # Static files that shall not be compiled
      images/   # will be just copied to `public` dir.
    views/      # Create any subdirectories inside `app` dir.
      file-1.js # JS files will be automatically concatenated to one file.
    file-2.js   # They will be also usable as modules, like require('file-2').
    file-1.css  # CSS files will be automatically concatenated to one file.
    stuff.css   # JS and CSS files may be linted before concatenation.
    tpl.jade    # You may have pre-compiled to JS templates. Also with `require`.
  vendor/       # All third-party libraries should be put here. JS, CSS, anything.
    scripts/    # They will be included BEFORE your scripts automatically.
      backbone.js
      underscore.js
  package.json  # Contains all brunch plugins, like jshint-brunch, css-brunch.
  config.coffee # All params (you can concat to 2, 5, 10 files etc.)
                # are set via this config. Just simple, 15 lines-of-code config.

新しいアプリを作成するには、基本的な定型文のようなブランチスケルトンを見てください。いずれかを選択してから使用しbrunch new --skeleton <url>、でブランチウォッチャーを起動するbrunch watch --serverと準備が整います。アプリをデプロイする場合は、brunch build --optimizeファイルを自動的に縮小するものを作成するだけです。

于 2013-02-21T04:37:16.800 に答える
3

単にうなり声から始めることをお勧めします。すべてのニーズに対応する単調なタスクがあります。

于 2013-02-20T20:04:26.747 に答える