mimosa-ember-module-import
Overview
This module will aid in your Ember application development by automatically building module manifest files. As Mimosa processes your assets, it keeps track of your Controllers/Views/Routers etc, and builds either an AMD or CommonJS compliant manifest for each namedspaced app in your project.
To see this module in action, check out the MimosaEmberSkeleton project.
Note: this module requires mimosa-require 2.2.3
(bundled with mimosa 2.3.14
) to function properly.
Usage
Add 'ember-module-import'
to your list of modules. That's all! Mimosa will install the module for you when you start mimosa watch
or mimosa build
.
Functionality
This module makes using module systems together with Ember easier. Ember doesn't work with async module loaders. Ideally, when Ember is fired up it wants to have all of the various Ember object types (Controllers, Views, Routers, etc) already attached/registered.
This module helps attach modules to Ember, and makes using your favorite module loaders, async or otherwise, easier. It can create module manifests for multiple namespaces in your application.
This uses an array of default folders (see emberDirs
below), and namespace
configurations to generate manifest
files. Those files contain a list of require
s for files containing Ember objects. Then, in the manifest, an object is created using the exported values from the require
d files as values, and the file names as the keys. If a file name is search_results_controller.js
, then the key would be SearchResultController
, which matches what Ember would like to see.
See some example outputs below.
MimosaEmberSkeleton showcases this module and its use in a require.js application.
Default Config
emberModuleImport: cacheDir: ".mimosa/emberModuleImport" amd: true fileSep: "_" apps: namespace: null additional: "router" exclude: manifestFile: "modules" emberDirs: "adapters" "components" "controllers" "helpers" "initializers" "mixins" "models" "routes" "serializers" "transforms" "utils" "views"
cacheDir
- location this module will place its cache information.amd
- whether the output is in AMD or CommonJS format. If set tofalse
, the output will be CommonJS style.fileSep
- Character/String used for separating portions of file name. Ex: tag_editor_controller.jsapps
- an array of the different apps in the project. Each app results in an output module file. This allows you to create multiple module manifests, thereby eventually letting you bundled together multiple sub-apps from the same project.apps.namespace
- the namespace of the app. namespace is the root folder relative towatch.javascriptDir
. Everything in thatnamespace
will be bundled together into a single module import file. When thenamespace
isnull
, the default, the entire application is used.apps.additional
- additional files, whether ember files outside of thenamespace
(like common components), or non-ember files inside or outside thenamespace
, to include in thenamespace
manifest
file. Paths are relative to thenamespace
. Use../
paths to include files/folders outside thenamespace
. In the default config,router
is an additional file. This would pick up arouter.js
sitting in the root of yournamespace
.apps.exclude
- array of strings or regexes that match files to not include in thismanifest
. Strings are paths that can be relative to thenamespace
or absolute.apps.manifestFile
- The name of the manifest file to output..js
is assumed. Path is relative tonamespace
.emberDirs
- Ember directories that contain files to include in a manifest file. Any files in these directories or in subdirectories of these directories within anamespace
will berequire
d in themanifest
file.
Example Config
emberModuleImport: apps: namespace: "user-app" additional: "../common/components" manifestFile: "user-modules" namespace: "search-app" additional: "../common/components" manifestFile: "search-modules"
In this config two applications, namespaced at user-app
and search-app
, exist in the same project, and they both share some common components at ../common/components
. Each has a manifest file (required) that will be deposited at the root of the namespace
. Give the above config, the expected project layout would resemble the below.
/assets
/javascripts
/common
/components
/user-app
/components
/views
...
/search-app
/components
/views
...
And the output file structure would resemble the following:
/public
/javascripts
/common
/components
/user-app
/components
/views
...
user-modules.js
/search-app
/components
/views
...
search-modules.js
Example Manifest File
AMD
;
CommonJS
var _0 = ;var _1 = ;var _2 = ;var _3 = ; var modules = PostController: _0 && _0'default' || _0 Helpers: _1 && _1'default' || _1 PostRoute: _2 && _2'default' || _2 PostsRoute: _3 && _3'default' || _3; moduleexports = modules;
To run tests
git clone
the repocd mimosa-ember-module-import
- Run
npm install
- Run
mimosa mod:install
npm test
You may get a Error: ENOTEMPTY, directory not empty
error with some of the test project directories. Haven't yet been able to track that down, but if that is the only error you get, you are in good shape. But you should run the tests until you get an all clear.