在Gitlab CI中如何压缩JavaScript代码？

Question

我为网页编写 JavaScript 代码，通常会在上传之前将其 压缩。 我使用专门的工具（如 UglifyJS）在本地进行操作，但我想通过 Gitlab 持续集成 自动化这个过程（因为我在这个项目中使用 Gitlab）。

我的目标似乎很简单：使用 Gitlab CI 在某些事件上压缩代码并以方便的方式输出这些文件，以便于我获取它们。

然而，我还没有找到任何东西（教程或其他）来完成这个任务。

因为我对 Gitlab CI 的经验非常少，所以我不知道从哪里开始，但我试图将其分解成更小的问题： - 我找不到一个 简单的脚本 来进行压缩/缩小，我可以使用 Gitlab CI 运行它，大多数都是较大的实用程序（YUI 压缩程序，Google Closure 编译器）。 - 如果我找到了一种压缩文件的方法，我能否从 CI 推送它们到我的仓库？如果可以，我在想是否实际上是好的做法，因为这将版本化缩小的文件，这是没有用处的。

我的 最佳选择是一些不太复杂的东西，似乎是使用 Google Closure 编译器，它可以与其 API 一起使用。如果我理解正确，我可以使用 Gitlab 的 Webhooks 调用该 API（不确定如何通过这种方式传递数据，但我会看看我能做什么）。但是，我应该如何读取响应（Gitlab Webhooks 看起来并不适合）？ 也许在 Gitlab CI 中直接进行这些 API 调用会更好，但老实说我不确定，主要是我如何获取压缩后的数据以及我可以对其执行什么操作（在何处存储它）。

- DylanM

---

为什么不构建或搜索一个Docker镜像来压缩你的Javascript？如果你可以在本地做到，那么你应该能够在Gitlab CI作业中复制它。 - djuarezg

确实，这看起来就是我想做的！我会去研究一下！我以前从未使用过Docker镜像，但我也会尝试看看是否可以用这种方式做些什么，谢谢。 - DylanM

Answer 1

如果有人想要通过在他们的流程中使用uglify.js来解决此问题。 您可以在管道中使用以下代码并获得缩小的代码。

minify-js:
  image: node:latest
  stage: process
  script:
    - npm install uglify-js -g
    - mkdir -p ./output
    - uglifyjs ./public/js/xxx.js -o output/xxx.min.js -c -m
  artifacts:
    paths:
      - output

deploy-dev:
  stage: deploy
  script:
    - cp output/xxx.min.js public/js/xxx.min.js

以上的Yaml代码在 minify_js 任务中将 xxx.js 文件转换为 xxx.min.js。

- hybrid

---

实际上，你的答案比我的更轻/更快。 - zar3bski

Answer 2

我的回答可能有些晚，但可能对其他人有所帮助。我认为最简单的方法是使用专用工具，例如yuicompressor（也可用于 CSS）。这里是一个gitlab-ci示例：

before_script:
  - apt-get update && apt-get install -y -qq sshpass
  - apt-get install -y -qq default-jdk
  - mkdir yuicompressor
  - wget -P yuicompressor/ https://github.com/yui/yuicompressor/releases/download/v2.4.8/yuicompressor-2.4.8.jar

deploy_production:
  stage: deploy
  environment: Production
  only:
    - master
  script: 
    - java -jar yuicompressor/yuicompressor-2.4.8.jar -o '.js$:.js' src/static/js/*.js
    - export SSHPASS=$SSH_PASS
    - sshpass -e scp -o stricthostkeychecking=no -r src/* user@some_domain.net:~/www/

说明

在将整个项目 src 通过sshpass发送到生产服务器之前，此管道会压缩和替换所有包含在src/static/js/中的js文件。

Before脚本

由于gitlab runners默认不包含java，因此我们使用apt-get install -y -qq default-jdk进行安装。然后我们只需要wget yuicompressor的jar文件。

希望对您有所帮助。

- zar3bski

---

有些晚了，但还是很有用，谢谢！ 我会尝试一下这个，因为我对这个问题还没有做过太多的研究。 - DylanM

@DylanM 如果你还有任何问题，请随时联系我。 - zar3bski

Answer 3

使用混合方法，我使其适用于Google Closure Compiler
仅在源文件发生更改时运行(changes)

minify-js:
  image: node:latest
  stage: process
  only:
    changes:
      - "public/js/script.js"
  script:
    - npm i -g google-closure-compiler
    - google-closure-compiler --js public/js/script.js --js_output_file tmp/script.min.js --language_in=ECMASCRIPT6_STRICT
  artifacts:
    paths:
      - tmp/script.min.js
    expire_in: 1 day

deploy-dev:
  stage: deploy
script:
    # Copy compiled script file if exist
    - test -f tmp/script.min.js && cp tmp/script.min.js public/js/script.min.js

- gmo