CLI commands

For any CLI commands, you can see all of the options available by using the --help flag.

For example, ember --help will show a list of all available top-level commands. ember generate --help will show a full list of all the types of files you can generate using the CLI.

The help command is also the best way to see the aliased or shorthand versions of common commands and options. For example, here are some of the most frequently used abbreviations:

ember new <my-app-name> [options]

ember new creates all the boilerplate files that are part of an Ember app. It puts them in a folder with the same name as whatever we provide in place of <my-app-name>.

This command below will create a folder called camping-trip-tracker, which will be full of app files. It uses the --yarn option to show that the app should use yarn by default. Yarn is a package manager alternative to npm. Options typically start with a double dash -- and can be omitted entirely.

ember new camping-trip-tracker --yarn

• Ember Quickstart Guide for creating a first app
• npm and Yarn for more on using package managers with Ember CLI

ember serve [options]

To stop an Ember server, press control-c.

ember serve takes all of the app's files and turns them into something that can be rendered in the browser. By default, we can view the app by visiting http://localhost:4200. It's a good idea to keep the server running as we work so that we know as soon as possible that we've broken something. The CLI watches the project folders and will reload the app in the browser when files change.

If the local server will not start due to missing dependencies, use npm install or yarn install to get going again.

By default, apps are served at port 4200, but if you need to change it for some reason, you could visit your app at http://localhost:3200 by using this command:

ember serve --port 3200

• Ember Quickstart Guide for starting a local server
• Proxying network requests to proxy network requests to another server

ember generate <type-of-file> <name-of-your-choice>

ember generate creates new files within your app. For example, you can use it to create components, routes, services, models, and more.

For a full list, type ember generate --help.

The CLI's generate command will ensure that new files contain the necessary boilerplate, that they go in the right directories, and that file naming conventions are followed. For example, components must always have a dash in their names. To avoid mistakes that are hard to debug, always use the CLI to create files instead of creating the files by hand.

This command will generate a page named about. It will create the following files in the app:

• app/templates/about.hbs, which defines what the page looks like
• app/routes/about.js where we can fetch the data required for the page
• tests/unit/routes/about-test.js with a minimal unit testing code

Also, it updates the app's router (app/router.js) with an entry to the about page.

command:

ember generate route about

ember install <addon-name>

ember install is used to install addons within your app. An addon is an npm package that was built specifically for use in an Ember app. You can find a full list of addons on Ember Observer. There are addon versions of many popular npm libraries, as well as packages that are unique to Ember. The majority are open source community addons. By convention, most addons have ember in the name, but not all of them.

To use non-addon npm packages directly, see "Managing Dependencies" section of the Ember.js Guide to learn about the options.

Here's an example of adding Sass support to your app using ember-cli-sass. Sass is an alternative to writing plain CSS. This is a popular community-maintained addon.

ember install ember-cli-sass

• Ember CLI Guide for using and choosing addons
• The Ember.js Guides section on Addons and Dependencies
• Writing addons to learn how to make your own addon

ember test [options]

ember test runs all of the tests found in the tests folder of the app. By default, it runs all the tests once and displays the results. We'll see things like syntax errors, linting problems, deprecations, and failed assertions in the command line output. To instead watch tests in the browser as they run, visit http://localhost:4200/tests while the local server is running with ember serve.

By default, these tests are run in Headless Chrome. "Headless" means the tests are running the Chrome environment, but we won't see the visual output of the browser. This makes the test suite faster.

To make tests re-run as we change files, we could use the --server option:

ember test --server

During development, this is less common than running ember serve and viewing the tests at http://localhost:4200/tests.

• The Ember.js Guides about Testing
• The Ember Super Rentals Tutorial which shows step-by-step how to write tests and understand the results

ember build [options]

ember build takes all of your app files and turns them into a bundle that is minified and transpiled into browser-ready JavaScript code, styles, and HTML. The bundled files go into a directory called dist. This bundle is what can be deployed to a server. By default, the build command uses the development environment configuration, which is not optimized for production.

Although you can upload the built files to a server yourself, many Ember projects use a community addon called ember-cli-deploy to get their apps into production. ember-cli-deploy has a plugin system to make it easy to deploy to many cloud vendors. Search Ember Observer for "deploy" to browse available options.

Ember apps can be built with only three environments: development, production, and testing.

This command builds the app using the production configuration, so that means by default, it will use maximum minification for best app performance.

ember build --environment production

• The Ember.js Super Rentals Tutorial has a section on deploying
• Search community addons for deployment on Ember Observer
• Enable feature flags in different environments using the environment config

ember addon <my-addon-name> [options]

ember addon creates all the boilerplate files for a new Ember addon. It puts them in a folder with the same name as whatever we provide in place of <my-addon-name>.

This command below will create a folder called ember-x-select.

ember addon ember-x-select

• Follow the tutorial to create your own Ember Addon!