在Ember.js中预编译模板

Question

我正在创建一个带有Node后端的Ember项目，并希望将我的模板作为单独的文件，而不是在index.html文件中内联。我已经阅读了许多解释这一点的文章，但我仍然无法完全了解整个过程以及index.html文件等在完成后会是什么样子。 Grunt是最有效的做这样的事情吗？这是我的grunt文件的样子。

Gruntfile.js：

grunt.loadNpmTasks('grunt-ember-templates');
grunt.registerTask('build', ['emberTemplates', 'concat', 'uglify']); //pass the compiled templates into your concat and uglify tasks. Don't worry, they don't care if they are mushed altogether


// with the following task in the Grunt.config
emberTemplates: {
    compileComponents: {
        options: {
            templateBasePath: /templates\//
        },
        files: {
            'build/precompile/components.js': 'templates/components/*.hbs'
        }
    },
    compileRoutes: {
        options: {
            templateBasePath: /templates\/routes\//
        },
        files: {
            'build/precompile/routes.js': ['templates/routes/*.hbs', 'templates/routes/**/*.hbs']
        }
    },
    compilePartials: {
        options: {
            templateBasePath: /templates\/partials\//
        },
        files: {
            'build/precompile/partials.js': 'templates/partials/*.hbs'
        }
    },
    compileSubstates: {
        options: {
            templateBasePath: /templates\/substates\//
        },
        files: {
            'build/precompile/substates.js': 'templates/substates/*.hbs'
        }
    },
    compileViews: {
        options: {
            templateBasePath: /templates\/views\//
        },
        files: {
            'build/precompile/views.js': 'templates/views/*.hbs'
        }
    }
}