0

私は gulp usemin タスクを使用して、HTML の css ファイルと js ファイルを組み合わせて最小化/醜くしています。

gulp.task('usemin',['jshint'], function () {
  return gulp.src('./app/**/*.html')
      .pipe(usemin({
        css:[minifycss(),rev()],
        js: [uglify(),rev()]
      }))
      .pipe(gulp.dest('dist/'));
});

そしてHTMLの私のブロック:

<!-- build:css styles/main.css -->
<link href="../bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="../bower_components/bootstrap/dist/css/bootstrap-theme.min.css" rel="stylesheet">
<link href="styles/home.css" rel="stylesheet">
<link href="../bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet">
<!-- endbuild -->

<!-- build:js scripts/main.js -->
<script src="../bower_components/jquery/dist/jquery.min.js"></script>
<script src="../bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="../bower_components/angular/angular.min.js"></script>
<script src="../bower_components/jquery-ui/jquery-ui.min.js"></script>
<script src="scripts/home.js"></script>
<script src="scripts/controllers.js"></script>
<!-- endbuild -->

しかし、私がこれを行った後。dist/ では、他のすべての部分は app/ と同様にうまく機能しますが、jquery-ui.jsです。jquery-ui が原因で、ページのカラー アニメーションが機能しません。

ファイル構造: ファイル構造

これはどうやってできるの？1 つの js ファイルだけが機能しませんが、他のファイルは正常に機能しますか?

4

1 に答える 1

0

私は自分でそれを見つけます。次のように、カラー アニメーション用の jquery-ui css ファイルを HTML に追加する必要があります。

<!-- build:css styles/main.css -->
<link href="../bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="../bower_components/bootstrap/dist/css/bootstrap-theme.min.css" rel="stylesheet">
<link href="../bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet">

<link rel="stylesheet" href="../bower_components/jquery-ui/themes/smoothness/jquery-ui.min.css">

<link href="styles/home.css" rel="stylesheet">
<link href="styles/timeline.css" rel="stylesheet">
<!-- endbuild -->

しかし、CSS ファイルを最小化する前に jquery-ui を問題なく使用できる理由がよくわかりません。

于 2016-02-20T04:40:16.107 に答える