Question

我正在打包和缩小javascript文件。我正在用口水做。现在，我希望如果我对任何文件进行任何更改并点击gulp，那么它将生成一个新的捆绑和缩小文件，其版本号如下：

pd.DataFrame.apply

然后

<script src="https://cdn.test.com/bundle-1.0.0-min.js/"></script>

我想使用gulp进行此操作，因为我已经将gulp用于其他目的。如果这是可能的话，还有另一件事是，无论如何，我每次更改时都不会在html页面中指定版本号，并且html页面会以某种方式获取最新版本。有帮助吗？

Answer 1

通常，这只是文件的重命名。但这实际上不是增加版本号的自动化任务。否则，您将很快获得1.0.2092之类的版本，这无济于事。我建议从package.json中读取版本，并将其用作文件名。如果您已经使用gulp，应该会很容易。

如果您不想使用version的全局版本（ package.json条目），则可以为捆绑软件版本添加自己的条目。甚至使用与package.json不同的文件。您甚至可以将其用作应该捆绑文件的配置，以将所有内容都放在一个位置：

{
  "bundle": {
      "version": "1.0.1",
      "files": [
        "path/to/file-one.js",
        "another/file.js",
        "..."
      ]
  }
}

一个简单的例子：

var pkg = require("./package.json");
var gulp = require("gulp");
var rename = require("gulp-rename");

gulp.src(pkg.bundle.files)
    .concat("bundle.js")
    .pipe(uglify())
    .pipe(rename(function(path) {
        path.extname = "-" . pkg.bundle.version + "-min" + path.extname;
    }))
    .pipe(gulp.dest("./"));

注意：您可以设置rename而不是concat，但我想将其拆分。但为了完整起见：

.concat("bundle-" + pkg.bundle.version + "-min.js")

关于问题的第二部分，以替换文件中的内容：

如果您也构建了html页面，并将相关路径替换/注入到其中，这将是可能的。您可以再次使用package.json的版本来构建和替换。或使用gulp-inject之类的工具。这个简单的工具可以将js和css文件添加到您的html模板中。只需在应将它们放置在html文件中的位置上创建一个区域，例如：。然后，这也是一个简单的gulp任务：

var pkg = require("./package.json");
var gulp = require("gulp");
var inject = require("gulp-inject");

gulp.src("dev/index.html")
    .pipe(inject("bundle-" + pkg.bundle.version + "-min.js"))
    .pipe(gulp.dest("prod/"));

Gulp- JavaScript填充的版本控制

1 个答案: