I have a simple Ember-CLI addon which provides a few helper Mixins. This addon is meant to be consumed by a set of addons which all want to do user-interface things (react to size changes, field validation, etc.).
So in essence there is a three step chain:
Ember CLI Application consumes UI Ember Addon
UI Addon consumes Mixin Addon to gain access to a common features library
Mixin Addon provides a set of Mixins to consumers
If I put the Mixins implementation into the /app/mixins directory than the UI Addon can import these mixins with an import to ../mixins/[mixin-name]. That works but when I try and move back to the actual Ember App it can no longer resolve the mixins.
I guess that's not surprising really and what I want to be able to do instead is reference the mixins directly, like so: ui-mixin-library/mixins/[mixin-name]. Unfortunately the resolver is not able to resolve this.
In order to help achieve this goal I have put all the mixins into the /addon/mixins directory -- and as the Ember-CLI page suggests -- I import and then export these in the corresponding /app/mixins folder. Doesn't seem to help. Not sure if maybe I need to run these mixins through app.import?
For reference purposes, the Mixin Addon can be found here: addon on github
Related
I have several ember apps which use a common shared ember-cli addon. This addon has common code like models, navigation etc. I also want this addon to provide common test support code like test helpers, factories to the ember apps. However if I remove tests from .npmignore in the addon, then the test resources gets built with the ember app.
Is there a way to use the addon in an ember app, but strip the addon's tests folder on build? Or perhaps there is a better way of achieving this?
Common code can go to the addon's test-support folder. That folder would automatically get merged into the app's tests folder.
This is mentioned here - https://ember-cli.com/extending/#addon-project-structure
I have a 'core' Ember application that needs to be able to be extended by 'child' Ember apps. In Ember 0.10, this was achieved by heavily modding grunt tasks, but Ember 2 appears to have a possible workflow for this built in.
A super high level summary of my current (and target) setup:
core-application ('core')
contains shared business logic across All apps + templates and components
plugins
shared templates and logic that can be reused across apps (but not needed by all)
application
is composed of elements from core-application, plugins, + any app specific code. a note that routes should be able to be 'pulled in' from 'core'
In the current Ember 0.10 app structure, this has worked by modifying grunt tasks to build the apps in a quick, fairly fool-proof way.
Now, in Ember 2, it appears that this sort of pathway for app development is provided by using addons and blueprints. I suspect my 'core' app should become a 'blueprint' and plugins could be either an 'addon' OR 'blueprint' based on what is required by them. I'm writing proof of concept code now, but I have the following questions:
what does the --blueprint flag for the ember addon command do? I see that it essentially generates an app structure, but I don't see any realy documentation regarding where to go from there. This appears to to be what I want to use for my 'core' app, but the documentation is lacking here.
If the above --blueprint flag isn't what I want for this kind of set up, is there a better approach I should be considering?
Any other info regarding the above that folk with greater Ember 2 + ember-cli experience than I have can share on this would be hugely helpful.
Thanks in advance for any all feedback.
I found my answer by digging around existing Ember community addons.
The ember admin project seems to outline the structure AND consumption of an Ember addon that essentially creates an Ember app complete with routes and overridable/extendable elements.
The Host application then 'mounts' the admin addon by importing the admin addon's routes to the host application's routes and BOOM things work as expected. I've been able to write POC code to prove this concept works for my needs.
You gotta love ember.js team... I'm getting this depreciation message saying that: "DS.FixtureAdapter has been deprecated and moved into an unsupported addon: https://github.com/emberjs/ember-data-fixture-adapter/tree/master". Guys maintaining that addon advise that we should use a library similar to Pretender. Has anybody done that? Is there a tutorial showing how to integrate this lib so that everything would work as before?
If you are using ember-cli it comes with an http-mock out of the box letting you quickly setup fixtures in a more realistic test scenario. For instance, for a Conversation model you would mock it by running the following prompt on your command line.
ember g http-mock conversations
This will scaffold an endpoint located at server/mocks/conversations.js that your real adapters will use to get data when you run ember serve. You can modify this file to your liking to return whatever fixtures / mock data you want for the various CRUD operations you need.
Server mocks:
Ember CLI's http-mock
Clientside mocks:
Pretender.js
jQuery mockjax
Ember CLI Mirage, basically sugar around Pretender
Clientside mocking has some advantages like portability, making it easy to use in a CI environment, but server mocks let you take advantage of express middleware.
Note: I maintain Mirage. You can watch a screencast & overview here.
I like to use http-mocks with ember-cli. In addition I like to use raw JSON files as the payloads for each endpoint here is an example setup https://github.com/pixelhandler/ember-fixturific/pull/1/files
I'm working on adding 'ember-simple-auth' to an EAK/grunt-based ember app, upgraded to ember 1.10. Bower is pulling in the latest 'simple-auth.js', not the old 'ember-simple-auth.js' version which the 'ember app kit simple auth' example uses. The component seems to be registered with Ember OK, since if I include the js file in index.html, I get a warning that it's already registered. One of the most basic things to do in getting started with simple-auth is to import the ApplicationRouteMixin into the ApplicationRoute, but I get 'module is not defined' or 'cannot be found'. I've tried many versions of syntax which I've seen in examples and blogs. Like 'import ApplicationRouteMixin from 'simple-auth/mixins/application-route-mixin' with ApplicationRouteMixin or SimpleAuth.ApplicationRouteMixin or Ember.SimpleAuth.ApplicationRouteMixin. Marco suggests I may need to load 'simple-auth.amd', since EAK-based apps transpile ES6 modules to AMD for loading in today's browsers. But I thought Ember Resolver handles that. I don't know how to set the grunt build to export one module over another. The old version adds the component to the namespace with 'Ember.SimpleAuth = Ember.Namespace.create', but the new versions don't have that syntax. How can I get the ember 'simple-auth' mixins imported into my Routes & Controllers?
I also tried dropping the separate mixin files into the project and was able to import/reference them that way but then there was an error about beforeModel needs to call _super so this because an uphill battle with no support or documentation so I had to give up on it. Both of my ember projects are upgraded to the latest Ember and jQuery so now am working on migrating them to CLI, then will revisit simple-auth again, since that's the only approach which might work.
I'm looking to replicate the exact functionality seen here: http://verbalink.com/services/transcription-services#transcription_rates
There's no change of URLs and no requests to the server.
What parts of the Ember framework would be needed to accomplish the above?
Ember, Handlebars, and JQuery (Ember has a dependency on it).