Putting component .js and .hbs together in ember-cli

Design
1

I have various components whose js files are under components/ and hbs files are under templates/components.

Is there a simple way to put them together in ember-cli? My proposed structure would be having both the js and hbs file under components/component-name/

Thanks

2

If you set up pods it can work this way.

Read more about pods here

Follow these steps

Setup pods path prefix in config/environment.js

It doesn’t have to be the word “pods” but something like

 // config/environment.js
 module.exports = function(environment) {
   var ENV = {
     modulePrefix: 'app',
     podModulePrefix: 'app/pods' // directory where resolver will look for your resource files
     environment: environment,
     baseURL: '/',
     locationType: 'auto',

Then when you run the generator for components add the --pod flag. e.g.

ember generate component x-foo --pod

ember generate component x-bar --pod

Then this will create your component in just the way you describe:

app/pods/components/x-foo
app/pods/components/x-bar

You should end up with a folder structure like this

...
  ├── app
  │  ├── pods
  │  │  └── components
  │  │     └── x-foo
  │  │     │  ├── component.js
  │  │     │  └── template.hbs
  │  │     └── x-bar
  │  │        ├── component.js
  │  │        └── template.hbs
...
3

Thanks for the info. Is it possible to do the same for a view?