以正确的顺序合并 javascript 个文件

Question

我有一个 javascript 应用程序，我在其中将代码拆分为不同命名空间中的文件，如下所示：

// file 1: src/Main.js
var Main = function () { .... 

// file 2: src/Main/SomethinElse.js
Main.SomethingElse = function () { ....

etc....

缩小时的问题是合并这些文件时，第一个文件必须总是第一个文件，然后是第二个文件。

现在我有一个执行编译的 bash 脚本，其中我有按正确顺序排列的所有文件的列表，但我必须在创建后将每个新文件添加到列表中，这看起来不太好。

是否有任何构建工具可以处理此问题，或者是否有某种方法可以重构我的代码以避免此问题？

Answer 1

我会选择 Gulp 来构建您的项目。它很容易理解，并为您的构建提供了很多插件。 Link

如果您想使用 Gulp，您可以像这样创建一个任务：

gulp.task('scripts', function() {
    gulp.src([
        'src/Main.js', // take main js file first
        'src/*.js', // take all js files in src
        'src/Main/SomethinElse.js'])
        .pipe(sourcemaps.init()) // create sourcemaps for your code
        .pipe(concat('index.js')) // create one js file for example index.js
        .pipe(stripDebug()) // you can debug here
        .pipe(uglify()) // minify your js file
        .pipe(sourcemaps.write('maps/')) // sourcemap destination
        .pipe(gulp.dest('scripts/')); // destination of your js file
});

希望能帮到你

Answer 2

简单（但不优雅）的方法是在源文件前加上数字

这样，您可以确定 main 在 main.example

之前定义

00_header.js
10_main.js
20_main/00_header.js
20_main/10_example.js
99_on_ready.js

此外，在 linux 上，排序 LC_ALL 依赖 - 参见 man sort。

以正确的顺序合并 javascript 个文件

Merging javascript files in the correct order

javascript

build

minify