Replace imports with minified versions in index.html on Gulp build

Gulpfile.js

@@ -10,16 +10,19 @@ var gulp = require('gulp'),
   jshint = require('gulp-jshint'),
   notify = require('gulp-notify'),
   autoprefixer = require('gulp-autoprefixer'),
-  minifycss = require('gulp-minify-css');
+  minifycss = require('gulp-minify-css'),
+  htmlreplace = require('gulp-html-replace');;
 
 var paths = {
   js: ['site/js/*.js', '!site/js/vendor/**/*.js'],
-  scss: 'site/scss/style.scss'
+  scss: 'site/scss/style.scss',
+  index: 'site/index.html'
 };
 
 var dests = {
   js: 'dist/js',
-  css: 'dist/css'
+  css: 'dist/css',
+  index: 'dist'
 };
 
 gulp.task('clean', function(cb) {
@@ -41,13 +44,22 @@ gulp.task('scss', function() {
   return gulp.src(paths.scss)
     .pipe(sass({ errLogToConsole: true }))
     .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
-    .pipe(gulp.dest(dests.css))
     .pipe(rename({suffix: '.min' }))
     .pipe(minifycss())
     .pipe(gulp.dest(dests.css))
     .pipe(notify({ message: 'compiled and minified scss' }));
 });
 
+gulp.task('index', function() {
+  return gulp.src(paths.index)
+    .pipe(htmlreplace({
+      'css': 'css/style.min.css',
+      'js': 'js/site.min.js'
+    }))
+    .pipe(gulp.dest(dests.index))
+    .pipe(notify({ message: 'copied index.html to dist/index.html' }))
+});
+
 gulp.task('watch', function() {
   gulp.watch(paths.js, ['js']);
   gulp.watch(paths.scss, ['scss']);
@@ -56,5 +68,5 @@ gulp.task('watch', function() {
 });
 
 gulp.task('default', ['clean'], function() {
-  gulp.start('js', 'scss');
+  gulp.start('js', 'scss', 'index');
 });

package.json

@@ -23,6 +23,7 @@
     "gulp-livereload": "",
     "gulp-cache": "",
     "gulp-notify": "",
+    "gulp-html-replace": "",
     "del": ""
   },
   "author": "Elvin Yung <[email protected]>",

site/index.html

@@ -3,8 +3,12 @@
     <meta charset="utf-8">
     <title>I am Elvin Yung.</title>
     <link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,400,300,700' rel='stylesheet' type='text/css'>
+    <!-- build:css -->
     <link rel="stylesheet" href="css/style.css">
+    <!-- endbuild -->
+    <!-- build:js -->
     <script src="js/site.js"></script>
+    <!-- endbuild -->
     <script>
       (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
       (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),