搜尋

首頁  >  問答  >  主體

javascript - gulp檔案合併後頁面連結替換問題

var gulp = require('gulp'),
    concat = require("gulp-concat");

gulp.task('concat', function () {
    gulp.src('js/*.js')  //要合并的文件
    .pipe(concat('libs.min.js'))  // 合并匹配到的js文件并命名为 "all.js"
    .pipe(gulp.dest('dist/js'));
});
<!DOCTYPE html>
<html ng-app="app">
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <link rel="stylesheet" href="style/base.css?/>
    <link rel="stylesheet" href="style/index.css?/>
</head>
<body>
<ui-view></ui-view>
</body>
<!-- build:js dist/js/libs.min.js --> <!--process-html插件需要用到这个注释-- >
<script src="js/libs/angular.min.js"></script>
<script src="js/libs/angular.touch.min.js"></script>
<script src="js/libs/zepto.20140520.js"></script>
<script src="js/libs/angular.ui.bootstrap.js"></script>
<script src="js/libs/angular-sanitize.min.js"></script>
<script src="js/libs/angular-ui-route.min.js"></script>
<script src="js/libs/fastclick.0.6.7.min.js"></script>
<script src="js/libs/carous.min.js"></script>
<!-- /build --> <!--process-html插件需要用到这个注释-->
</html>

建置後

<!DOCTYPE html>
<html ng-app="app">
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <link rel="stylesheet" href="style/base.css?/>
    <link rel="stylesheet" href="style/index.css?/>
</head>
<body>
<ui-view></ui-view>
</body>
<script src="dist/js/libs.min.js"></script> <!--注意这里的变化-->
</html>

js檔案合併後,如何才能一次改變,HTML頁面上的連結呢,如果合併的js運用到多個HTML頁面的話,用gulp-processhtml還是不夠快捷

#
过去多啦不再A梦过去多啦不再A梦2749 天前684

全部回覆(1)我來回復

  • 曾经蜡笔没有小新

    曾经蜡笔没有小新2017-05-19 10:47:59

    可以參考 https://github.com/dolymood/b...

    回覆
    0
  • 取消回覆