前端工程化-Gulp/useRef文件引用处理

        截止到目前绝大多数构建任务基本上都已经完成了，但是对于dist下生成的文件还有一些小问题。比如在HTML文件中存在对node_moduls目录下文件的引用，这些文件并没有被拷贝到dist文件目录下面。如果将这个dist目录部署到线上的话，就会出现问题。为了解决这个问题可以使用一个插件叫做useRef yarn add gulp useref --dev，它会自动处理html当中的构建注释。构建注释的格式是：

<!-- build:css assets/styles/vendor.css -->
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css">
<!-- endbuild -->

<!-- build:css assets/styles/main.css -->
<link rel="stylesheet" href="assets/styles/main.css">
<!-- endbuild -->

<!-- build:js assets/scripts/vendor.js -->
<script src="node_moduls/jquery/dist/jquery.js"></script>
...
<!-- endbuild -->
<!-- build:js assets/scripts/main.js -->
<script src="assets/scripts/main.js"></script>
<!-- endbuild -->

const useref = () => {
    return src('dist/*.html', {base: 'dist'})
        .pipe(plugins.useref({ searchPath: ['dist', '.'] }))
        .pipe(dest('dist'))
}