Gulp BabelJs编译问题顺序错误

Question

我面临着一个与使用gulp babel编译ES6脚本相关的问题。我的项目可能由40 - 50个不同的ES6文件组成(每个文件一个class )。

在过去，我尝试过让babel插件按照自己的顺序编译这些文件。不幸的是，由于缺少声明的类(受错误的编译顺序影响)，导致了运行时错误。

我现在的问题是:有没有办法自动保证正确的编译顺序，而不是手动维护这个列表？

如果没有，有没有ES6编译器可以自动保证正确的编译顺序？

谢谢并致以最良好的问候

Answer 1

我认为问题在于，babel并不能解决你的依赖问题。

例如：

// ComponentA.js
import AbstractComponent from './AbstractComponent';
class ComponentA extends AbstractComponent { ... }

// AbstractComponent.js
class AbstractComponent { ... }
export default AbstractComponent;

// gulpfile.js
gulp.task('js', function () {
return gulp.src(['./resources/javascript/ComponentA.js'])
    .pipe(concat('app.js'))
    .pipe(babel({ presets: ['@babel/env']}))
    .pipe(gulp.dest('./public/js'));
});

这里问题是，babel找不到它的父类，因为它没有在ComponentA类之前定义。我也有同样的问题，但没有解决方案。

例如，React你可以从类中导入并编译成es5，一切都很好……