I still get the error below despite following the instructions on this link Ember.js: HtmlBars and the Handlebars.compile command .
Below I have copied and pasted my packages package.json, bower.json and brocfile.js. Not sure what causes the problem.
Fault: unable to call compile without template compiler loaded. Download ember-template-compiler.js before calling compile .
package.json
{ "name": "ui", "version": "0.0.0", "description": "Small description for ui goes here", "private": true, "directories": { "doc": "doc", "test": "tests" }, "scripts": { "start": "ember server", "build": "ember build", "test": "ember test" }, "repository": "", "engines": { "node": ">= 0.10.0" }, "author": "", "license": "MIT", "devDependencies": { "bower": "^1.3.12", "broccoli-asset-rev": "^2.0.2", "broccoli-funnel": "^0.2.3", "broccoli-merge-trees": "^0.2.1", "ember-cli": "0.2.7", "ember-cli-app-version": "0.3.3", "ember-cli-babel": "^5.0.0", "ember-cli-content-security-policy": "0.4.0", "ember-cli-cookie": "^0.1.0", "ember-cli-dependency-checker": "^1.0.0", "ember-cli-htmlbars": "0.7.6", "ember-cli-ic-ajax": "0.1.1", "ember-cli-inject-live-reload": "^1.3.0", "ember-cli-less": "^1.1.1", "ember-cli-pusher": "0.1.2", "ember-cli-qunit": "0.3.13", "ember-cli-simple-auth": "^0.7.3", "ember-cli-simple-auth-oauth2": "^0.7.2", "ember-cli-simple-auth-torii": "^0.8.0-beta.1", "ember-cli-tooltipster": "0.0.6", "ember-cli-uglify": "^1.0.1", "ember-data": "1.0.0-beta.18", "ember-disable-proxy-controllers": "^1.0.0", "ember-export-application-global": "^1.0.2", "ember-idx-button": "^0.1.3", "ember-idx-forms": "^0.5.1", "ember-mousetrap": "0.2.0", "ember-template-compiler": "^1.9.0-alpha", "express": "^4.8.5", "glob": "^4.0.5", "torii": "^0.3.3" } }
bower.json
{ "name": "ui", "dependencies": { "ember": "1.12.0", "ember-cli-shims": "ember-cli/ember-cli-shims#0.0.3", "ember-cli-test-loader": "rwjblue/ember-cli-test-loader#0.1.3", "ember-data": "1.0.0-beta.18", "ember-load-initializers": "ember-cli/ember-load-initializers#0.1.4", "ember-qunit": "0.3.3", "ember-qunit-notifications": "0.0.7", "ember-resolver": "~0.1.15", "jquery": "^1.11.1", "loader.js": "ember-cli/loader.js#3.2.0", "qunit": "~1.17.1", "bootstrap": "~3.3.4", "ember-addons.bs_for_ember": "~0.7.0", "slick.js": "~1.4.0", "jquery-mousewheel": "~3.1.12", "videojs-youtube": "~1.2.8", "tooltipster": "~3.3.0", "owl-carousel2": "latest", "ember-mousetrap": "~0.2.0", "ember-validations": "2.0.0-alpha.3", "rsvp": "~3.0.18", "bootswatch": "v3.3.4+1", "ember-simple-auth": "0.7.3", "progressbar.js": "~0.8.1", "jquery-autocomplete": "~1.1.1", "jssocials": "~0.2.0", "ember-pusher": "0.1.1" }, "resolutions": { "ember-cli-test-loader": "0.1.3", "ember-load-initializers": "0.1.4", "loader.js": "3.2.0", "ember": "1.12.0", "ember-data": "1.0.0-beta.18", "ember-qunit": "0.3.3", "ember-qunit-notifications": "0.0.7", "jquery": "^1.11.1", "select2": "~4.0.0" } }
Brocfile.js
/* global require, module */ var EmberApp = require('ember-cli/lib/broccoli/ember-app'); var pickFiles = require('broccoli-funnel'); var mergeTrees = require('broccoli-merge-trees'); var app = new EmberApp(); app.import('bower_components/ember-addons.bs_for_ember/dist/js/bs-core.max.js'); app.import('bower_components/ember-addons.bs_for_ember/dist/js/bs-notifications.max.js'); app.import('bower_components/ember-addons.bs_for_ember/dist/js/bs-alert.max.js'); app.import('bower_components/ember-addons.bs_for_ember/dist/js/bs-button.max.js'); app.import('bower_components/ember-addons.bs_for_ember/dist/js/bs-modal.max.js'); app.import('bower_components/bootstrap/js/modal.js'); app.import('bower_components/bootstrap/js/dropdown.js'); // TF - Start app.import('bower_components/rsvp/rsvp.js'); app.import('bower_components/tooltipster/css/themes/tooltipster-light.css'); app.import('bower_components/mousetrap/mousetrap.js'); app.import('app/styles/custom.css'); //JSSocial app.import('bower_components/jssocials/dist/jssocials.css'); app.import('bower_components/jssocials/dist/jssocials-theme-flat.css'); app.import('bower_components/jssocials/dist/jssocials.js'); app.import('bower_components/font-awesome/css/font-awesome.min.css'); //Progressbar.js app.import('bower_components/progressbar.js/dist/progressbar.min.js'); app.import('bower_components/progressbar.js/local-dev/main.css'); ///questions/706691/emberjs-htmlbars-and-the-handlebarscompile-command app.import('bower_components/ember/ember-template-compiler.js'); var fontAwesome = pickFiles('bower_components/font-awesome/fonts',{ srcDir: '/', files: ['fontawesome-webfont.eot','fontawesome-webfont.svg','fontawesome-webfont.ttf','fontawesome-webfont.woff','fontawesome-webfont.woff2','FontAwesome.otf'], destDir: '/fonts' }); var videojsFonts = pickFiles('bower_components/video.js/dist/video-js/font',{ srcDir: '/', files: ['vjs.ttf','vjs.woff'], destDir: '/assets/font' }); var bootstrapFonts = pickFiles('bower_components/bootstrap/fonts',{ srcDir: '/', files: ['glyphicons-halflings-regular.eot','glyphicons-halflings-regular.svg','glyphicons-halflings-regular.ttf','glyphicons-halflings-regular.woff','glyphicons-halflings-regular.woff2'], destDir: '/assets/fonts' }); module.exports = mergeTrees([app.toTree(), videojsFonts, bootstrapFonts, fontAwesome]);
configurations / environment.js
/* jshint node: true */ module.exports = function(environment) { var ENV = { modulePrefix: 'ui', environment: environment, // firebase: 'https://blistering-torch-5880.firebaseio.com/', baseURL: '/', locationType: 'auto', 'simple-auth': { /* The authenticationRoute is where the app will redirect if it enters an authenticated route without being authenticated */ authenticationRoute: 'session', authorizer: 'simple-auth-authorizer:oauth2-bearer', crossOriginWhitelist: ['http://localhost:9990/'] }, torii: { providers: { // https://developers.facebook.com/docs/facebook-login/permissions/v2.3 'facebook-connect': { appId: '**************', scope: 'public_profile,email,user_friends,user_likes,user_education_history' }, 'google-oauth2-bearer': { //https://console.developers.google.com/project/275897053280/apiui/credential?authuser=0 redirectUri: 'http://localhost:4200/', apiKey: '********************, scope: 'https://www.google.com/m8/feeds' } } }, EmberENV: { FEATURES: { // Here you can enable experimental features on an ember canary build // eg 'with-controller': true } }, // Here you can pass flags/options to your application instance // when it is created APP: { // https://pusher.com/docs/client_api_guide/client_connect#connecting PUSHER_OPTS: { key: '***************', connection: { authEndpoint: 'http://localhost:9990/api/v1/auth/pusher', encrypted: true }, logAllEvents: true, //https://pusher.com/docs/authenticating_users#authEndpoint/lang=cs-mvc } } }; ENV.contentSecurityPolicy = { 'default-src': "'none'", 'script-src': "'self' 'unsafe-eval' https://www.youtube.com/ https://s.ytimg.com/", 'font-src': "'self' data: http://fonts.gstatic.com/", 'connect-src': "'self' http://localhost:9990 wss://*.firebaseio.com ws://ws.pusherapp.com/", 'img-src': "'self' http://i2.ytimg.com https://img.youtube.com/ data:", 'style-src': "'self' 'unsafe-inline' http://fonts.googleapis.com/", //'unsafe-inline', I believe was required 'media-src': "'self'", 'frame-src': "'self' https://img.youtube.com/ https://www.youtube.com/ ", 'report-uri': "http://localhost:4200" //https://github.com/rwjblue/ember-cli-content-security-policy/issues/12 } if (environment === 'development') { // ENV.APP.LOG_RESOLVER = true; ENV.APP.LOG_ACTIVE_GENERATION = true; // ENV.APP.LOG_TRANSITIONS = true; // ENV.APP.LOG_TRANSITIONS_INTERNAL = true; ENV.APP.LOG_VIEW_LOOKUPS = true; } if (environment === 'test') { // Testem prefers this... ENV.baseURL = '/'; ENV.locationType = 'auto'; // keep test console output quieter ENV.APP.LOG_ACTIVE_GENERATION = false; ENV.APP.LOG_VIEW_LOOKUPS = false; ENV.APP.rootElement = '
This is the specific place in the code causing the problem:
ember.debug.js:33409 Uncaught Error: Cannot call `compile` without the template compiler loaded. Please load `ember-template-compiler.js` prior to calling `compile`. exports['default'] = function (templateString, options) { if (!compile && Ember.__loader.registry["htmlbars-compiler/compiler"]) { compile = requireModule("htmlbars-compiler/compiler").compile; } if (!compile) { throw new Error("Cannot call `compile` without the template compiler loaded. Please load `ember-template-compiler.js` prior to calling `compile`."); }