使用BabelJS进行转译时如何保持AngularJS文件的顺序

Question

我已经开始尝试使用NPM脚本和BabelJS移植我的ES2015 AngularJS项目。 问题是连接顺序不正确，并导致nomod错误。

给定此目录结构：

MyApp
  +- src
  |   +- dashboard
  |   |   +- search-bar
  |   |   |   +- search-bar.directive.js
  |   |   |   +- search-bar.service.js
  |   |   |   +- search-bar.spec.js
  |   |   +- dashboard.module.js
  +- dist
  |   +- js
  |   |   +- dashboard.js

理想情况下， dashboard.module.js应该是第一个文件，因为这是创建实际dashboard模块的位置，然后是/search-bar的所有内容，而实际上根本不需要任何顺序。 搜索栏是功能部件/组件，而不是新模块，并且是dashboard一部分。

问题似乎在于，简单地运行BabelJS只会使用与文件系统相同的结构将所有文件连接在一起。

babel ./src/dashboard/**/*.js -o ./dist/js/dashboard.js

弄乱通配符以确保所有文件都被捕获时，还有一些奇怪的事情。

如何首先处理其他组件之前的dashboard.js ？

Answer 1

事实证明，您可以指定许多glob作为输入文件。

尝试使用以下命令：

babel ./src/dashboard/*.js ./src/dashboard/**/ -o ./dist/js/dashboard.js

这将首先处理/dashboard内部紧随其后的所有.js ，再处理其余目录。

陷阱：只有在/dashboard根目录中只有一个文件，这才真正起作用。 如果要添加dashboard.config.js或任何其他文件，则将按该文件系统顺序处理这些文件。 不幸的是， dashboard.config.js在dashboard.js之前，因此您的问题将继续。 :(

另外，如果/dashboard根目录中还有其他文件，或者不想包含其他类型的.js ，则需要忽略它们。

尝试：

babel ./src/dashboard/**/*.js ./src/dashboard/**/ --ignore *.spec.js --ignore *.conf.js -o ./dist/js/dashboard.js

这将使事情排在正确的顺序，并且还会跳过您可能放置在其中的所有karma.config.js或search-bar.service.spec.js文件。 我假设您不希望将那些实际用于生产中。