javascript - Gulp dist 构建优化

Question

首先，这是我的完整设置，以便您可以测试它。 https://mega.nz/#!cZQUjZJR!eiDBDtDPKvn2LVsoQk_JfdU4alzrYx4ydSf_kuzkzvE

一切工作正常，但我有两个问题不知道如何解决。

1. 使用 gulp build 运行构建时，一切工作正常，除了我的自定义 JS 初始化始终被排除在最终结果之外。意思是custom.js在 js/scripts.js 中找不到文件的内容文件。每次都得手动添加，很烦人。

   <!-- build:js js/scripts.js -->
script(src='js/jquery-3.2.1.slim.min.js')
script(src='js/popper.min.js')
script(src='js/bootstrap.min.js')
script(src='js/highlight.js')
script(src='js/clipboard.min.js')
script(src='js/custom.js')
<!-- endbuild -->

2. 如何修复文档中的所有相对路径，因为在开发时，它们引用的是本地服务器，例如结果 CSS 文件中的所有内容都应具有以下路径 url("../ ，而现在一切都是url("/ 。

无论您认为哪些内容可能会被删除/优化，请分享一些智慧。

提前谢谢大家!

Answer 1

在index.html中，我可以看到build:js包装器

</div><!-- build:js js/scripts.js -->
    <script src="js/jquery-3.2.1.slim.min.js"></script>
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/highlight.js"></script>
    <script src="js/clipboard.min.js"></script>
    <script src="js/custom.js"></script><!-- endbuild -->

它不考虑 <!-- endbuild --> 行所以它排除 custom.js

更改为

</div>
    <!-- build:js js/scripts.js -->
    <script src="js/jquery-3.2.1.slim.min.js"></script>
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/highlight.js"></script>
    <script src="js/clipboard.min.js"></script>
    <script src="js/custom.js"></script>
    <!-- endbuild -->

将 custom.js 引入 script.js

更新

使用这个=运算符写入换行符

= '\n'
<!-- build:js js/scripts.js -->
script(src='js/jquery-3.2.1.slim.min.js')
script(src='js/popper.min.js')
script(src='js/bootstrap.min.js')
script(src='js/highlight.js')
script(src='js/clipboard.min.js')
script(src='js/custom.js') 
= '\n'
<!-- endbuild -->