7

AngularJSを使用するCoffeeScriptで記述されたプロジェクトがあります。私のベンダー依存関係はBowerを使用してインストールされ、私のファイル構造は次のようになります。

- assets
 - js
  - app
   - model
    - *.coffee
   - factory
    - *.coffee
   ...
   - app.coffee
   - config.coffee
   - routes.cofeee
  - vendor
   - angular
   - lodash
   ...
  - dist

私がやろうとしていることは次のとおりです。

  1. RequireJSを使用r.jsしてアプリファイルを最適化する方法を模索しているので、基本的に連結ファイルがすべて正常に順序付けられます(ベンダーの依存関係、構成とルート、およびそれらがアプリファイルになります)。
  2. これを私のGruntファイルに統合します。

オプティマイザーを使用してみr.jsましたが、アプリファイル(ベンダーの依存関係を除く)をdistフォルダーにコピーするだけなので、ばかげているかもしれません。ただし、coffee生成されたjsファイルを最適化することはできます。

誰かがこれを経験したことがありますか?

4

2 に答える 2

11

私はそれを理解しました:r.jsあなたとあなたがあなたの構成内で名前を付けたモジュールを読むことによって機能しますmainConfigFile、ここで重要な注意はあなたの名前付きモジュール内r.jsの最初のrequire/を見るだけでdefineそれらを探すために行くということです。したがって、たとえば、次の名前のモジュールがありますapp

require ['config'], (cfg) ->
  require ['angular'], (A) ->
    A.module cfg.ngApp, []

    require ['routes'], () ->
      require [
        'factory/a-factory',

        'service/a-service',

        'controller/a-controller'
      ], () ->
        A.bootstrap document, [cfg.ngApp]

ここでの問題はr.js、最初のrequireステートメントを通過できなかったため、連結が機能していなかったことです。app.coffeeこれをに変更したとき、(my )と言います。

require ['config'], (cfg) ->
  require ['angular'], (A) ->
    A.module cfg.ngApp, []

    require ['bootstrap'], (bootstrap) ->
      bootstrap()

そして私のbootstrap.coffee

define [
  'config',
  'angular',
  'routes',

  'factory/a-factory',

  'service/a-service',

  'controller/a-controller'
], (cfg, A, routes) ->
  class Bootstrap
    constructor: () ->
      routes()

      A.bootstrap document, [cfg.ngApp]

angularこれは、次のようにbootstrapr.js構成で定義するだけで、残りの作業を行うincludes必要があることを意味します。r.js

baseUrl: 'assets/js/app',
mainConfigFile: 'assets/js/app/config.js',
name: 'app',
include: [
  '../vendor/requirejs/require',
  'bootstrap'
],
out: 'assets/js/dist/app.js'

そして今、それはすべてうまくいきます!r.js~~それは私が含めるように言わなければならないのは残念requirejsです、多分私はそこで愚かなことをしましたか?~~

Blimey、私はそのようなディンガスです!

したがって、私のHTMLでは、連結されたスクリプトを次のようにロードしていました。

<script src="assets/js/dist/app.js"></script>

実際に次のようにロードする必要がある場合:

<script src="assets/js/vendor/requirejs/require.js" data-main="assets/js/dist/app"></script>

D'oh!

于 2013-02-10T09:18:24.143 に答える
1

r.jsdocから

https://github.com/jrburke/r.js/blob/master/build/example.build.js#L322

ネストされた依存関係は、requireJS>v1.0.3にバンドルできます。

//Finds require() dependencies inside a require() or define call. By default
//this value is false, because those resources should be considered dynamic/runtime
//calls. However, for some optimization scenarios, it is desirable to
//include them in the build.
//Introduced in 1.0.3. Previous versions incorrectly found the nested calls
//by default.
findNestedDependencies: false,
于 2014-01-23T00:42:30.250 に答える