Ember.js projects are automatically discovered when imported via
File → New → Project from Existing Sources.... The importer will look for an
.ember-cli file and will flag the project as an Ember.js project if the file
exists.
The language level for Ember.js projects is automatically set to ES6 and
JSHint support is enabled if a .jshintrc file is found.
The importer will mark certain folders like this:
appasSources RootpublicasResources Roottests,tests/unitandtests/integrationasTests RootdistandtmpasExcluded
This will cause the "Packages" view to look like this:
The plugin is indexing all typical components in the app folder and is
providing them for quick access via the Navigate → Class... action. Currently
supported are:
- Adapters
- Components
- Controllers
- Helpers
- Models
- Routes
- Serializers
- Services
- Transforms
The indexer will transform file paths into class names by capitalizing the path parts and appending a type suffix
Example: app/routes/pets/index.js will be indexed as PetsIndexRoute
The plugin provides an implementation for the Navigate → Related Symbol...
quick navigation.
Example: Invoking the action inside of /app/routes/crate/index.js will
switch to the /app/controllers/crate/index.js file if it exists.
The following groups of files can be cycled like this:
controllers,routes,templatescomponents,templatesadapters,models,serializers
The same functionality can also be used to cycle between tests and the tested
components (i.e. /app/routes/crate/index.js and
/tests/unit/routes/crate/index.js)
Some Ember.js method calls result in container lookups and can not be resolved
statically. The Ember.js plugin implements a best effort reference resolver
for cases like DS.belongsTo('user'), where ctrl-clicking the
'user' literal will navigate directly to the user model if it exists.
The same functionality also provides basic code completion via ctrl + space:
Have a look at the
EmberReferenceContributor
class to check for which methods this functionality is available.
The same code completion and reference functionality is also available inside of Handlebars templates for the components and helpers in your project. Note that this does not work for components/helpers imported from addons yet.
Some of the ember-cli commands are exposed right in the IDE for quick access.
A new Ember CLI project can be created through File → New → Project... and
then choosing Static Web and either Ember CLI App or Ember CLI Addon.
The Ember.js plugin can be used to quickly generate files using the generate
command of ember-cli. This functionality is available as
File → New → Ember.js Code.
The plugin adds a Ember Serve
run configuration
that allows you to launch a
development server.
A new Ember Serve run configuration can be created through
Run → Edit Configurations....
To configure advanced settings like the server host, proxy or ssl, expand the
Advanced settings panel.
This plugin also adds a Ember Test run configuration that will run your projects tests.
A new Ember Test run configuration can be created through
Run → Edit Configurations....
To configure advanced settings like the server host, test filter or config file, expand the
Advanced settings panel.
Live templates are snippets with variables that are automatically expanded by
the editor. For example: if you enter comp and press the Tab key
it will be expanded into a computed property:
The following live templates are available:
alias– computed property aliascomp– computed propertycompset– computed property with settercompx– computed property methodtest– qunit testpt– pauseTestthen– andThen
Most screenshots in this document are taking from an import of the crates.io project.