问题:

I have a bunch of modules defined in an Ember CLI app and each starts with the same path. I would like to import the modules into a module in the app. For example, I could write:

import post1 from 'posts/1'; import post2 from 'posts/2'; import post3 from 'posts/3';  export default Em.ObjectController.extend({   posts: Em.A(post1, post2, post3), });

However, I do not know the module names because they are created/named on the fly by a precompiler. All I know is that the path always begins with the same string. In this case, posts.

Is there a way to import all modules that begin with a particular path? For example, how can I do something like the following:

import posts from 'posts/*';  // or  registry['posts'].forEach(postId, i) {   var path = 'posts/' + postId;    import i from path; }

Each of the modules I want to find and import has exported an object.

I have been through the ES6 module transpiler docs but can't find much.

回答1:

The ES6 spec doesn't allow you to dynamically import modules using the import keyword. All importing and exporting using the module syntax must be done statically. However, it does provide a programmatic API that you can use to dynamically import modules. This article has a great summary of it (as well as a great summary of the rest of ES6 modules).

My suggestion would be to wrap Ember's loader API in a ES6 compliant wrapper. For instance, Ember-CLI uses the require() function to get modules, so you could do something like this:

window.System = window.System || {}; window.System['import'] = function(moduleName) {     return Ember.RSVP.Promise.resolve(window.require(moduleName)); }  // ...  System.import('my-app/posts/' + postNumber).then(function(postModule) {     // ... });

You could also use the Ember require() function directly, my way just protects you in the likely event that Ember changes their module loader.

转载请标明出处:Dynamic module import in Ember CLI

文章来源: Dynamic module import in Ember CLI

标签

ember