当部署我的应用我想将凉亭依赖复制到deploy该目录的链接,并注入到这些文件到index.html,这也是在deploy目录中.
单独的每一步都完美无缺,因为我无法将它们组合起来.
复制文件:
return gulp.src(mainBowerFiles(), { read: false })
.pipe(gulp.dest('./deploy/lib/'));
注入文件:
return gulp.src('./deploy/index.html')
.pipe(plugins.inject(
gulp.src(mainBowerFiles(), { read: false }), { relative: true }))
.pipe(gulp.dest('./deploy/'));
我认为我应该一步到位,以保持依赖文件的正确顺序.
我试过这个组合,但没有成功.
return gulp.src('./deploy/index.html')
.pipe(plugins.inject(
gulp.src(mainBowerFiles(), { read: false })
.pipe(gulp.dest('./deploy/lib/'), { relative: true })))
.pipe(gulp.dest('./deploy/'));
Aus*_*ray 13
我推荐wiredep:
你在你的html中添加一个块:
<html>
<head>
</head>
<body>
<!-- bower:js -->
<!-- endbower -->
</body>
</html>
你的wiredep任务看起来像:
// inject bower components
gulp.task('wiredep', function () {
var wiredep = require('wiredep').stream;
gulp.src('app/*.html')
.pipe(wiredep())
.pipe(gulp.dest('app'));
});
这会将deps添加到你的html中:
<html>
<head>
</head>
<body>
<!-- bower:js -->
<script src="bower_components/foo/bar.js"></script>
<!-- endbower -->
</body>
</html>
然后,您可以将其与useref结合使用,以订购项目的所有javascript依赖项
html块
<!-- build:js scripts/app.js -->
<!-- bower:js -->
<script src="bower_components/foo/bar.js"></script>
<!-- endbower -->
<script src="js/yourcustomscript.js"></script>
<!-- endbuild -->
吞咽任务
gulp.task('html', ['styles'], function () {
var assets = $.useref.assets({searchPath: '{.tmp,app}'});
return gulp.src('app/*.html')
.pipe(assets)
.pipe(assets.restore())
.pipe($.useref())
.pipe(gulp.dest('dist'));
});
看看generator-gulp-webapp如何做事:https://github.com/yeoman/generator-gulp-webapp
注意:$.plugin语法假定var $ = require('gulp-load-plugins')();
| 归档时间： |
|
| 查看次数： |
11396 次 |
| 最近记录： |