最有效的方式来Grunt concat目录文件？(Most efficient way to Grunt concat directories files?)

我为这个非常尴尬的问题标题道歉，如果有人能想出一个更好的方式来表达这个问题，我会马上改变它。

我正在使用Angular和RequireJS构建一个应用程序，并尝试优化性能，依赖性和延迟加载我正在寻找构建这样的文件结构：

/app ----/regisitration --------_registration.module.js --------registration.ctrl.js --------registration.svc.js --------registration.directive.js ----/courses --------_courses.module.js --------courses.directive.js --------courses.controller.js --------courses.service.js --------/course ------------course.controller.js ----/admin --------_admin.module.js --------admin.controller.js

在我设置路由的地方，我希望能够让一个用户进入任何/registration/ view加载整个_registration.module.js ，这将是/registraion目录中所有其他.js文件的串联（以及任何子目录）这样我的团队就不会因为需要包含多个可能重复的依赖项而陷入困境，并且一次性向用户提供整个站点“部分”。希望上面的示例显示为什么我不想只加载所有文件，因为大多数用户永远不会访问网站的admin部分。我试图找出用grunt实现这一目标的最有效方法，但到目前为止，我正在非常手动地使用这样的代码：

grunt.initConfig({ concat: { app: { files: [ { src: ['..app/registration/*.js', '!..app/registraion/*.module.js'], dest: '..app/registration/_registration.module.js' }, { src: ['..app/courses/*.js', '!..app/courses/*.module.js'], dest: '..app/courses/_courses.module.js' }, { src: ['..app/admin/*.js', '!..app/admin/*.module.js'], dest: '..app/admin/_admin.module.js' } ], } }, });

我认为必须有一种更有效，更少手动的方式去做我想要实现的目标。有没有人有什么建议？

I apologize for the very awkward question title, if anyone can think of a better way to phrase this question I'll change it immediately.

I'm building an app with Angular and RequireJS and to try to optimize performance, dependencies and lazy-loading I'm looking to build a file structure like this:

/app ----/regisitration --------_registration.module.js --------registration.ctrl.js --------registration.svc.js --------registration.directive.js ----/courses --------_courses.module.js --------courses.directive.js --------courses.controller.js --------courses.service.js --------/course ------------course.controller.js ----/admin --------_admin.module.js --------admin.controller.js

Where I set up my routing, I want to be able to have a user who goes to any /registration/ view load the entirety of _registration.module.js which would be the concatenation of all the other .js files within the /registraion directory (and any sub directories) so that my team isn't bogged down by needing to include several and possibly duplicate dependencies as well as serve the entirety of the site "section" to the user in one shot. Hopefully the sample above shows why I wouldn't want to just front-load all the files, because most users will never hit the admin section of the site. I'm trying to figure out the most efficient way to achieve this with grunt, but so far I'm working very manually with code like this:

grunt.initConfig({ concat: { app: { files: [ { src: ['..app/registration/*.js', '!..app/registraion/*.module.js'], dest: '..app/registration/_registration.module.js' }, { src: ['..app/courses/*.js', '!..app/courses/*.module.js'], dest: '..app/courses/_courses.module.js' }, { src: ['..app/admin/*.js', '!..app/admin/*.module.js'], dest: '..app/admin/_admin.module.js' } ], } }, });

I think there must be a more efficient and less manual way to do what I'm trying to achieve. Does anyone have any suggestions?

最满意答案

请记住，您仍然可以在Gruntfile中执行JavaScript。

grunt.initConfig({ concat: { app: { files: grunt.file.expand({ cwd: 'app', filter: 'isDirectory' }, '*') .map(function(ngModule) { return { src: ['app/' + ngModule + '/*.js', '!app/' + ngModule + '/*.module.js'], dest: 'app/' + ngModule + '/_' + ngModule + '.module.js' }; }) } }, });

有了这个，您应该能够创建新模块而无需记住更新它们的配置条目。

Remember that you can still execute JavaScript within your Gruntfile.

grunt.initConfig({ concat: { app: { files: grunt.file.expand({ cwd: 'app', filter: 'isDirectory' }, '*') .map(function(ngModule) { return { src: ['app/' + ngModule + '/*.js', '!app/' + ngModule + '/*.module.js'], dest: 'app/' + ngModule + '/_' + ngModule + '.module.js' }; }) } }, });

With this, you should be able to create new modules without needing to remember to update a config entry for them.

更多推荐