Skip to content

Instantly share code, notes, and snippets.

@ldong

ldong/create_ember_addon.md

Last active July 6, 2017 00:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save ldong/815e4ab118ba2fad6a78996f1f5824c2 to your computer and use it in GitHub Desktop.
Save ldong/815e4ab118ba2fad6a78996f1f5824c2 to your computer and use it in GitHub Desktop.
Download ZIP
Ember Addon
Raw
create_ember_addon.md

Prologue

As Ember developer for a while, I always wonder to know how to create an Ember Addon? At this time, I was given such opportunity, and I want to share how I created Ember Addon.

Ground work

create an addon folder by running ember addon <NAME>, in my case, the name is stupid-switch. ember addon stupid-swtich

Go to package.json to remove ember-welcome-pag from devDependencies and add "ember-cli-htmlbars": "^1.1.1" (your version may vary) to dependencies. You may need to run rm node_modules/ember-welcome-page if installed perviously.

Now, run ember s

Components

Next step is to actually create addons, after run ember g component stupid-switch as usual, you will notice the files structure will be in the addon director instead of app directory.

Do your thing to customize this component.

Show the dummy

You may wondering why my component is not showing up. You need to run ember generate template application to create a gloal applicaiton template and put your component(s) inside.

Go to /tests/dummy/app/templates/application.hbs and put your component(s) inside.

Write tests

Write test coverage perferably 100%, otherwise you are doomed to be the only developers who is not afraid of using crappy addons.

Demo

My stupid-switch: http://github.com/ldong/stupid-switch

screen shot 2017-07-05 at 4 39 57 pm

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment