Generating new layout templates

ember g layout path/to/<size>

ember g layout works with either routes or components, the path/to part should be the path to the component or route including the name of the component or route, while /<size> should be the name of a breakpoint.

For example:

ember g layout components/foo/mobile

This will add the components/foo/-layouts/mobile.hbs file to your application.

Converting existing templates to layout templates

You can convert an existing template to a layout template using move:layout or mvl as shorthand.

ember move:layout <type> <name> [-b <breakpoint>] [-v]

Classic

ember mvl route foo/bar -b "desktop"

ember mvl component foo/bar -b "mobile"

Pods

If you are moving a route template instead of component, or a pod component that's not within the components/ directory, you can do this:

ember mvl foo/bar -b "desktop"

Flags

If you define defaultBreakpoint in config/flexi.js it will be used for -b if none is provided

-v is verbose mode, will show you the paths being resolved