Javascript 如何在生成时自动更改脚本标记url

我使用

index.html

<script src="js/api/require.js"></script>
<script>require(['js/require-cfg'],function(){require(['main'])});</script>

在生产中，我使用将文件编译成

main build.js

，并将

index.html

文件中的链接从

main

重定向到

main build

：

<script>require(['js/require-cfg'],function(){require(['main-build'])});</script>

require（['js/require-cfg']，function（）{require（['main-build']）}）；

目前，如果我想将我的代码部署到生产环境中，我必须在

index.html

中手动将

main

更改为

main build

，或者在运行本地或测试环境时将链接保持为

main build.js

但将

main build.js

的内容更改为与

main.js

相同，然后在部署到生产环境时切换回

是否有更好的（自动）方式让代码在生产环境中使用编译的

main build.js

，在本地或测试环境中使用

main.js

的内容

例如：使用节点环境变量来更改

index.html

（不知道如何更改html！）中的链接，或者更改

main build.js

的内容，但是每次运行r.js编译生产时，内容都会被覆盖

我个人使用它来处理

index.html

文件

在开发中，您需要放置所需的标记

require（['js/require cfg']，function（）{require（['main']）}）；

要进行生产构建，请创建一个使用gulp html替换插件的gulp任务：

<script>require(['js/require-cfg'],function(){require(['main-build'])});</script>

var gulp = require('gulp'),
    htmlreplace = require('gulp-html-replace');

gulp.task('build', function() {

    return gulp.src("index.html")
        .pipe(htmlreplace({
            js: {
                src: [['main-build']],
                tpl: '<script>require(["js/require-cfg"],function(){require(["%s"])});</script>'
            },
        }))
        .pipe(gulp.dest("build/index.html"));
});

var rjs = require('requirejs');

gulp.task('optimize', function(done) {
    rjs.optimize({
        name: "main",
        out: "build/js/main.min.js",
        /* ...other options */
    }, function(buildResponse) {
        done();
    }, done);
});