https://github.com/emberexperts/ember-snippets
All-in-one snippets for Ember apps. Forget about syntax, focus on development.
https://github.com/emberexperts/ember-snippets
Last synced: 5 months ago
JSON representation
All-in-one snippets for Ember apps. Forget about syntax, focus on development.
- Host: GitHub
- URL: https://github.com/emberexperts/ember-snippets
- Owner: EmberExperts
- Created: 2019-02-03T17:52:56.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2023-02-11T00:19:44.000Z (over 3 years ago)
- Last Synced: 2025-08-09T05:31:40.500Z (11 months ago)
- Language: JavaScript
- Homepage: https://marketplace.visualstudio.com/items?itemName=exelord.ember-snippets
- Size: 1.08 MB
- Stars: 5
- Watchers: 1
- Forks: 1
- Open Issues: 7
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ember-snippets
All-in-one snippets for Ember apps. Forget about syntax, focus on development.
Supported editors:
- vscode: https://marketplace.visualstudio.com/items?itemName=exelord.ember-snippets
**WARNING!** In most cases, snippets are up-to-date which means they assume you use the latest Ember, Ember-data or any other addon with our snippets.
## What's included?
Following snippets are just a selected subset.
**Full documentation can be found in [`/docs`](https://github.com/Exelord/ember-snippets/tree/master/docs) folder**
### Ember Snippets
#### 1. Fully compatible Ember imports (ember-rfc176-data)
Import anything by using `im*`, eg.
```
imtypeof -> import { typeOf } from '@ember/utils';
imcomputed -> import { computed } from '@ember/object';
iminject -> import { inject as service } from '@ember/service';
```
#### 2. Cheats
Cheat with Ember API snippets in your `.js` files by using shortcuts like:
```
service -> service(),
super -> this._super(...arguments);
run -> run(() => { });
computed ->
computed('property', function() {
// body
}),
didDestroyElement ->
didInsertElement() {
this._super(...arguments);
},
```
#### 3. Skeletons
Forget about generators. Just use the skeletons for anything, eg:
```
component ->
import Component from '@glimmer/component';
class Component extends Component {
}
```
#### 4. Handlebars snippets
Take the advantage of faster templating by using HBS snippets, eg:
```
yield -> {{yield}}
debugger -> {{debugger}}
on -> {{on }}
if ->
{{#if }}
{{/if}}
eachelse ->
{{#each as ||}}
{{else}}
{{/each}}
linkto ->
```
## Contribution
Is this package missing your favorite addon or snippet? It's super easy to contribute!
1. Create a new folder in `src/javascript` for JS or `src/handlebars` for HBS with you addon name, eg. `my-addon`
2. Create files like `cheats.js`, `imports.js` or `skeletons.js`
3. Fill in the files with following structure:
```js
module.exports = {
"superFunction": {
"prefix": "imsuperFunction",
"body": "import { superFunction } from 'my-addon';",
"description": "superFunction allows you to do super things"
},
}
```