3

他の誰かがWeb アプリケーションGruntのビルド ツールとして使用してEmberいて、私と同じ動作を経験していますか? 現時点では、バージョンのフレームワークを使用しており、RC3手間をかけずにビルド ツールを使用して、必要なすべてのライブラリをインポートし、それらを醜く圧縮して、すべてが魅力的に機能します。

とにかく、少なくとも、Ember がハンドルバーを認識しなくなるため、アプリケーションのビルドEmber RC5に使用できなくなったためです。. それは常に不平を言っており、その後すぐに、含まれているライブラリを認識していないという仮定につながります。GruntEmber Handlebars requires Handlebars version 1.0.0-rc.4. Include a SCRIPT tag in the HTML HEAD linking to the Handlebars file before you link to Ember.Cannot read property 'COMPILER_REVISION' of undefinedEmberHandlebars

app.jsjs ファイルへの参照 (RC3 の代わりに Ember RC5/6 を使用し、RC3 の代わりにハンドルバー RC4 を使用) を除いて、何も変更していません(ライブラリ/フレームワークの順序はそのままです)。Ember.Handlebarsしかし、それ以来、何かが初期化を壊しているようです...

ここで何か問題がありますか?Gruntビルド ツールとして引き続き使用できるソリューションはありますか?


編集

これが私のものGruntfile.jsです:

/*jshint camelcase: false */
/*global module:false */
module.exports = function (grunt) {

  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    meta: {
      dev: {
        buildPath: '.'
      },
      prod: {
        buildPath: '.'
      }
    },

    /*
     Task for uglifyng the application javascript file in production environment
     */
    uglify: {
      options: {
        banner: '/*! <%= pkg.name %> - v<%= pkg.version %> - ' +
            '<%= grunt.template.today("yyyy-mm-dd") %> */'
      },
      prod: {
        files: [
          {
            src: '<%= meta.prod.buildPath %>/js/application.js',
            dest: '<%= meta.prod.buildPath %>/js/application.min.js'
          }
        ]

      }
    },

    /*
     Task for creating css files out of the scss files
     */
    compass: {
      prod: {
        options: {
          environment: 'production',
          noLineComments: true,
          outputStyle: 'expanded',
          cssDir: '<%= meta.prod.buildPath %>/css',
          fontsDir: '<%= meta.prod.buildPath %>/fonts',
          imagesDir: '<%= meta.prod.buildPath %>/images',
          javascriptsDir: '<%= meta.prod.buildPath %>/js'
        }
      },
      dev: {
        options: {
          environment: 'development',
          noLineComments: false,
          outputStyle: 'expanded',
          cssDir: '<%= meta.dev.buildPath %>/css',
          fontsDir: '<%= meta.dev.buildPath %>/fonts',
          imagesDir: '<%= meta.dev.buildPath %>/images',
          javascriptsDir: '<%= meta.dev.buildPath %>/js'
        }
      }
    },

    /*
     Task to minify all css files in production mode.
     All css files will end with '.min.css' instead of
     just '.css'.
     */
    cssmin: {
      minify: {
        expand: true,
        cwd: '<%= meta.prod.buildPath %>/css/',
        src: ['*.css', '!*.min.css'],
        dest: '<%= meta.prod.buildPath %>/css/',
        ext: '.min.css'
      }
    },

    /*
     Clean up the production build path
     */
    clean: {
      cssd: ['<%= meta.prod.buildPath %>/css/**/*']
    },


    /*
     A simple ordered concatenation strategy.
     This will start at app/app.js and begin
     adding dependencies in the correct order
     writing their string contents into 'application.js'

     Additionally it will wrap them in evals
     with @ sourceURL statements so errors, log
     statements and debugging will reference
     the source files by line number.

     This option is set to false for production.
     */
    neuter: {
      prod: {
        options: {
          includeSourceURL: false
        },
        files: [
          {
            src: 'app/app.js',
            dest: '<%= meta.prod.buildPath %>/js/application.js'
          }
        ]
      },
      dev: {
        options: {
          includeSourceURL: true
        },
        files: [
          {
            src: 'app/app.js',
            dest: '<%= meta.dev.buildPath %>/js/application.js'
          }
        ]
      }
    },

    /*
     Watch files for changes.

     Changes in dependencies/ember.js or application javascript
     will trigger the neuter task.

     Changes to any templates will trigger the ember_templates
     task (which writes a new compiled file into dependencies/)
     and then neuter all the files again.
     */
    watch: {
      application_code: {
        files: ['js/dependencies/ember.js', 'app/**/*.js'],
        tasks: ['neuter:dev']
      },
      compass: {
        files: [
          'styles/**/*.scss'
        ],
        tasks: ['compass:dev']
      }
    },

    /*
     Runs all .html files found in the test/ directory through PhantomJS.
     Prints the report in your terminal.
     */
    qunit: {
      all: ['test/**/*.html']
    },

    /*
     Reads the projects .jshintrc file and applies coding
     standards. Doesn't lint the dependencies or test
     support files.
     */
    jshint: {
      all: ['Gruntfile.js', 'app/**/*.js', 'test/**/*.js', '!js/dependencies/*.*', '!test/support/*.*'],
      options: {
        jshintrc: '.jshintrc'
      }
    },

    /*
     Generate the YUI Doc documentation.
     */
    yuidoc: {
      name: '<%= pkg.name %>',
      description: '<%= pkg.description %>',
      version: '<%= pkg.version %>',
      options: {
        paths: '<%= meta.dev.buildPath %>/app/',
        outdir: '<%= meta.dev.buildPath %>/yuidocs/'
      }
    },

    /*
     Find all the <whatever>_test.js files in the test folder.
     These will get loaded via script tags when the task is run.
     This gets run as part of the larger 'test' task registered
     below.
     */
    build_test_runner_file: {
      all: ['test/**/*_test.js']
    }
  });

  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-contrib-qunit');
  grunt.loadNpmTasks('grunt-neuter');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-compass');
  grunt.loadNpmTasks('grunt-contrib-clean');
  grunt.loadNpmTasks('grunt-contrib-cssmin');
  grunt.loadNpmTasks('grunt-contrib-yuidoc');

  /*
   A task to build the test runner html file that get place in
   /test so it will be picked up by the qunit task. Will
   place a single <script> tag into the body for every file passed to
   its coniguration above in the grunt.initConfig above.
   */
  grunt.registerMultiTask('build_test_runner_file', 'Creates a test runner file.', function () {
    var tmpl = grunt.file.read('test/support/runner.html.tmpl');
    var renderingContext = {
      data: {
        files: this.filesSrc.map(function (fileSrc) {
          return fileSrc.replace('test/', '');
        })
      }
    };
    grunt.file.write('test/runner.html', grunt.template.process(tmpl, renderingContext));
  });

  /*
   A task to run the application's unit tests via the command line.
   It will
   - convert all the handlebars templates into compile functions
   - combine these files + application files in order
   - lint the result
   - build an html file with a script tag for each test file
   - headlessy load this page and print the test runner results
   */
  grunt.registerTask('test', ['neuter', 'jshint', 'build_test_runner_file', 'qunit']);

  /*
   Configures all tasks which will be executed with production setup
   */
  grunt.registerTask('prod_tasks', ['clean', 'compass:prod', 'cssmin', 'neuter:prod', 'uglify:prod']);

  /*
   Setup for the production build. Sets the production build path.
   */
  grunt.registerTask('prod', 'Production Build', function () {
    grunt.task.run('prod_tasks');
  });

  /*
   Configures all tasks which will be executed with development setup
   */
  grunt.registerTask('dev_tasks', ['compass:dev', 'neuter:dev', 'watch']);

  /*
   Setup for the development build. Sets the development build path.
   */
  grunt.registerTask('dev', 'Development Build', function () {
    grunt.task.run('dev_tasks');
  });

  // Default task
  grunt.registerTask('default', 'dev');

  /*
   Configures all tasks which will be executed with doc setup
   */
  grunt.registerTask('doc_tasks', ['yuidoc']);

  /*
   Setup for the YUI doc generation.
   */
  grunt.registerTask('doc', 'Generate YuiDoc Documentation for the App', function () {
    grunt.task.run('doc_tasks');
  });

};

編集2

ember-1.0.0-rc.6.jsEmber.js Web サイトのスターター キットからファイルとファイルを取得し、そのhandlebars-1.0.0-rc.4.js上で Grunt タスクを実行しようとしました。Chromeが私に言っていることは次のとおりです。 Ember RC6 Grunt Buildstep のハンドルバーに関する問題


編集3

念のため、Ember.js Githubページで提起された問題へのリンクを次に示します: https://github.com/emberjs/ember.js/issues/2894


編集4

最後に、この問題はHandlebars、@Tao が回答で報告したように、グローバル エクスポートを処理する際の矛盾であることが判明しました。フォローしたい場合は、GitHub の問題へのリンクを次に示します: https://github.com/wycats/handlebars.js/issues/539

4

2 に答える 2

1

テンプレートのコンパイルに使用されるHandlebarsバージョンと、スクリプト タグを介して含まれるバージョンが一致しません。

を使用している場合grunt-contrib-handlebarsは、npm モジュール ハンドルバーを使用してテンプレートをコンパイルします。handlebars モジュール/プロジェクトは Ember から独立しており、Ember と互換性がある場合とない場合がある独自のリビジョンがあります。

ハンドルバーとの互換性を維持するために、Ember は警告している特定のバージョンのハンドルバーを必要とします。

ここで注意が必要なのはgrunt-contrib-handlebars、特定のバージョンのハンドルバーを強制的に使用するようにする必要があることです。

解決策 1: シュリンクラップを使用して、grunt-contrib- handlebarsのハンドルバー依存バージョンを変更します。

解決策 2: これは私が現在使用しているものです。エンブレムに切り替えました。エンブレム grunt タスクは、handlebars ファイルを明示的に要求するため、ノードのサブ依存関係管理にドロップダウンする必要はありません。また、ビルドには同じファイルがスクリプト タグに含まれているため、将来のリビジョンでの重複や不一致を回避できます。

編集:Gruntfile編集後

Gruntfile を見ると、何も問題はありません。js -> neuter -> (if prod) -> uglify標準的なビルドプロセスなどのように見えます。

emberjs と handlebars js ファイルの両方を更新してみる必要があると思います。スターター キット自体のファイルを使用してみてください。これらは確実に連携して動作します。

そして、Chrome/Inspector で縮小されていないソースを見て、index.html についてこれを確認します。Handlebars.VERSIONハンドルバーには、バナーの下にやのようなリビジョン番号がありHandlebars.COMPILER_REVISIONます。それらを、ember.js ファイルのどこか@submodule ember-handlebars-compilerにあるEmber.assert.

于 2013-06-24T15:19:33.020 に答える