{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 We Are One 的问题《uglified files are not rewritten in html file usin》','https://www.manongdao.com/q-1370165.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
I am facing a problem with gulp-usemin plugin. when usemin task is running it is concating and uglifying css and js files, but the uglified js files are not rewritten in html file though it is generated. I am sharing my gulpfile.js and index.html code .
index.html before conversion
<html>
<head>
<!-- build:css build/css -->
<link rel="stylesheet" href="css/blue.css">
<link rel="stylesheet" href="css/green.css">
<link rel="stylesheet" href="css/orange.css">
<!-- endbuild -->
<!-- build:js build/js1 -->
<script src="js/add.js"></script>
<script src="js/sub.js"></script>
<script src="js/mul.js"></script>
<!-- endbuild -->
</head>
<body>
<p class="blue" id="sum"></p>
<p class="green" id="diff"></p>
<p class="orange" id="mul"></p>
<img src="images/1.jpg" width="304" height="228">
<img src="images/2.jpg" width="304" height="228">
<script>
document.getElementById('sum').innerHTML=add(4,4);
document.getElementById('diff').innerHTML=sub(4,4);
document.getElementById('mul').innerHTML=mul(4,4);
</script>
</body>
</html>
gulpfile.js
var usemin = require('gulp-usemin');
var gulp = require('gulp');
var uglify = require('gulp-uglify');
var minifyHtml = require('gulp-minify-html');
var minifyCss = require('gulp-minify-css');
var jshint = require('gulp-jshint');
var concat = require('gulp-concat');
var rev = require('gulp-rev'),
notify = require('gulp-notify');
gulp.task('usemin', function() {
gulp.src('./*.html')
.pipe(usemin({
css: [minifyCss(), 'concat'],
html: [minifyHtml({empty: true})],
js: [uglify()]
}))
.pipe(gulp.dest('build/'));
});
index.html after conversion
//you can see that build/css is generated but build/js is not generated
<html>
<head>
<link rel="stylesheet" href="build/css"/>
</head>
<body>
<p class="blue" id="sum"></p>
<p class="green" id="diff"></p>
<p class="orange" id="mul"></p>
<img src="images/1.jpg" width="304" height="228">
<img src="images/2.jpg" width="304" height="228">
<script>
document.getElementById('sum').innerHTML=add(4,4);
document.getElementById('diff').innerHTML=sub(4,4);
document.getElementById('mul').innerHTML=mul(4,4);
</script>
</body>
</html>
Help me in fixing this issue. Thanks in advance .
First, you are missing the
revin yourjsusemincall, change yourtaskto:Also, the last parameter of the
blocksingulp-useminrepresent the path of afile. You should precise the extension to not confuse with a directoryFor clarity, you should also put a line break between the two different blocks.