ember folder contains only gitkeep file - ember.js

after creating a folder in ember I see nothing but a file called ".gitkeep" in all the folders such as routes and templates(in every folder). This problem seems to be repeating after trying to install many times..

.gitkeep files are here to force git to commit the directory. By default git do not version folder and an ember-cli project is by default a git repository. (unless you specified --skip-git).
A new ember-cli project should contain at least app/templates/application.hbs because this is all you need to start.
You can add routes and controllers with ember generate route and ember generate controller.

Related

Best directory structure for modified addons in /node_modules in an ember.js app?

I have a number of addons that I have modified, all managed with git. When upgrading, I need to be careful to not delete these modules when emptying the node_modules directory in preparation for npm install.
Is there a solution to this, such as nesting customized modules in another directory, either under node_modules or elsewhere? What configuration, if any, would be needed?
You should create your own Ember addons, using original modules as base, instead of manually directly editing addons' files in node_modules directory.

how do i add vendor javascript to ember-cli 2.2

This might be a silly question stemming from unfamiliarity. I'm rewriting a project that was previously using Ember 1.7 in Ember 2.3, using Ember-cli v2.2
Now, in the old project, there were a couple of libraries being included manually on the index.html file, put in the scripts directory and then compiled. For example, let's say the JS asset I want to include is offline.js.
I understand that Ember-cli uses Bower and can be used to install bower components, like Bootstrap or moment.js and such. What about custom JS? I've put the file in offline.js, included it in index.html but that doesn't do anything.
I don't think I understand how to add/import vendor assets at all; how do add, say offline.js to the project and have it available throughout the application?
You should add the offline.js file to the vendor folder at the root of the project, and then in your ember-cli-build.js file add the following line:
app.import('vendor/offline.js');
This adds the offline.js file to the vendor.js which is built by default. You can see more documentation at the Ember CLI website.

ember-cli watch file changes in subdirectories of the styles folder

I started using EmberJS and ember-cli for a new project. Therefore I created a new project with ember-cli and added broccoli-compass with sass support. When I execute "ember server" in the terminal, ember is just watching for file changes on /app/styles/app.scss. I want ember-cli to also reload on file changes in subdirectories of the /app/styles folder (e.g. /app/styles/helpers/breakpoints.scss). How can I configure ember-cli for this purpose?
I just tried making a helpers directory and watchme.scss, and it sucessfully watches for changes, I suggest update your ember-cli version via npm update ember-cli. Here's the output:
file changed styles/helpers/watchme.scss
Build successful - 157ms.

Exclude files while using Ember-CLI testem

I am trying to run my tests using Ember-CLI - Testem.
Ember-CLI uses tests/index.html and not the usual testem.json config for testing.
Is there any way I can exclude certain files from being built into app.js?
Usecase : I have some js files where I inject some dependencies. These dependencies are different during the testing environment. I would like to ignore these files and inject the dependencies from my test-injectors.
I'm answering in the context of an ember application using ember-cli 1.13.8 and ember 2.1.
ember-cli does use testem.json unless you pass another test configuration file via ember test -c path/to/testem.json. Though, not all options from testem.json are integrated into ember-cli's test process.
To exclude trees, checkout:
ember-cli exclude a directory beneath "tests" from being watched by "ember serve"
For ignoring specific files in tests, you can rename files so that they do not match the pattern embedded into ember-cli-test-loader:
https://github.com/ember-cli/ember-cli-test-loader/blob/master/test-loader.js#L38-L40

How can extend the ember-cli build?

I want to have some custom steps run during them ember cli build, is there a supported way to do that? Specifically, I want to parse comments in css files and build write files to the public directory based on those comments.
You should create an ember-cli addon to create extra build steps. There is some good documentation around on Google, but here is a blog post I used to create addons. This guide is more tailored toward creating ember components but there are other ember-cli hooks you could use to run code during the build process.
Perhaps you could use the included hook to run some code to read your css files and then import your files into the public directory. Other hooks that you could use are documented here
Alternatively, if there is a broccoli plugin that does what you want, you simply need to add it to your package.json and run npm install. Now the plugin has been added to the build system.