javascript - 如何使用 Pug 缩小/丑化内联 JavaScript？

Question

我将 Pug 用于我正在构建的网页。 在模块的末尾，我有一个 script. 标记(不能使用常规的 script 标记，因为它与 jQuery 不兼容):

script.

    // load more videos
    $("#btn-more").click(() => {
        $.get(`#{lang}/videos?quantity=#{numVideos + 2}`)
            .done((videos) => {
                $(videos).ready(() => {
                    $("#videos").replaceWith(videos)
                })
            })
    })

这最终会生成未缩小的代码:

<script>// load more videos
$("#btn-more").click(() => {
    $.get(`en/videos?quantity=6`)
        .done((videos) => {
            $(videos).ready(() => {
                $("#videos").replaceWith(videos)
            })
        })
})</script>

有没有办法让 Pug 缩小代码？我还没有想出如何在 script. 标签上使用过滤器(Uglify JS)。

Answer 1

1. 首先确保JSTransformer Uglify JS已安装

npm i jstransformer-uglify-js

1. 现在，您应该能够使用 :uglify-js 过滤器呈现以下模板。

script: :uglify-js
    $("#btn-more").click(() => {
        $.get(`#{lang}/videos?quantity=#{numVideos + 2}`)
            .done((videos) => {
                $(videos).ready(() => {
                    $("#videos").replaceWith(videos)
                })
            })
    })