7

プロジェクト紹介

私のプロジェクトは、単一ページのストアフロントです。プロジェクトには複数のモジュールがあり、各モジュールには一連の controller.js、view.js、model.js ファイル、および template.html ファイルが含まれています。また、requirejs を使用して依存関係を管理します。

問題文

grunt-requirejs の参照モジュールへのパスを提供するために mainConfigFile を使用したいと考えています。私のmainConfigFileのrequire.configの一部は別のファイル(base.dependency.config)に保存され、require.config.pathsは実行時にアンダースコアでつなぎ合わされます。

base.dependency.config

config = {
    baseDependencyConfig: {
        paths: { ... }
        shim: { ... }
    }
}

main.js

var dependencies = config.baseDependencyConfig;
var basePaths = config.baseDependencyConfig.paths;
var extensionPaths = {
    // extra sets of paths
};

// combine base paths and extension paths at runtime using underscore
var dependencyPaths = _.extend(basePaths, extensionPaths);

dependencies.paths = dependencyPaths;
require.config(dependencies);

// application startup
require(['app', 'eventbus']) {
    // code
}

エラー

ただし、grunt requirejs は mainConfigFile を無視しています。実際には、require.config パスの下で「app」が

'app': 'modules/base/app/base.app.controller'

私のうなり声ファイル:

module.exports = function (grunt) {
    grunt.initConfig({
        // ... other plugin config
        requirejs: {
            options: {
                baseUrl: 'public',
                // the paths for the named modules such as 'app' are defined 
                // in main.js under require.config paths
                name: 'main',
                include: [
                    'app',
                    'cart',
                    'category'
        ],
        out: 'public/build/app-optimized.js',
        mainConfigFile: 'public/main.js',
        findNestedDependencies: true,
        optimizeCss: 'none',
        cssImportIgnore: 'style/style.css, style/mocha.css',
            }
        }
    })
}

私のファイル構造

public
    |--modules/
    |       |--base/
    |       |       |--cart
    |       |       |--category
    |       |               |--category.controller.js
    |       |               |--category.view.js
    |       |               |--category.model.js
    |       |               └-category.template.html
    |       |
    |       └--extension/
    |
    |--style/
    |--image/
    |--main.js <-- main config file
    |--other .js files
  • mainConfigFile、main.js は、他のいくつかのアプリケーション起動 js ファイルとともにルートに存在します。
  • アプリケーション ファイルの大部分は、modules フォルダー内に存在します。
  • 各モジュール フォルダーには、そのコントローラー、ビュー、モデル js ファイル、および template.html ファイルが含まれます。

編集

gruntFile は、別の mainConfigFile (main.js) セットアップで以前は機能していました。

require.config({
    paths: {...}
    shim: {...}
})

// application startup
require(['app', 'eventbus']) {
    // code
}
4

1 に答える 1

3

r.js はEsprima を Javascript パーサーとして使用して、指定された .xml ファイルから構成オブジェクトを抽出しますmainConfigFile。コード内の特定の署名のみを検索します。

見る

  • hasRequire(): AST ノードが構成呼び出しの候補であると判断します
  • findConfig(): 構成を抽出する方法を決定する上記を呼び出します

認識を認識させるパッチを作成しました

requirejs.config(_VariableToExport = { ... });

これには制限があり、Javascript パーサーのアプローチでは、r.js が関数によって作成された構成 (コード内など) を抽出できるようにすることが非常に複雑になります。このパッチはまだプロジェクトに提出されていません。私はまだ官僚主義に苦しんでいます。

これまでのところ唯一の有効な回避策は

  • 使用しないmainConfigFile
  • 構成を NodeJS モジュールとしてエクスポートする
  • main.jsノードで/を必要とするconfig.js(Grunt)
  • オブジェクトを値として config 属性またはメソッドに渡す

落書きについては、この問題に対する私のコメントを参照してください。

このアプローチは、私が取り組んでいる別の少し古いプロジェクトで証明されています。

r.js 2.1.11 に関連します。

于 2014-04-27T11:59:21.527 に答える