我正在开发一个示例应用程序,它使用
bower作为它的依赖管理和
gulp它的构建系统.
我使用main-bower-files插件将所有相关文件从bower_components目录复制到build / dist / bower_components目录中.
这一切都很完美,我可以打开我的应用程序的index.html,它正确地指向每个这些文件,并且它们正确地指向了资产.
我的下一步是连接bower_components,以便我拥有单个CSS和单个JS文件以及所有资源(字体,图像等).我已经使用gulp-useref捆绑所有的组件,它似乎工作很好.
然而,组合的一些CSS和JS文件使用相对路径来引用资源,这些资源现在是不正确的,因为一切都在一个文件中:
> FontAwesome
引导
>和我们创建的自定义保镖组件
有固定资产的标准解决方案吗?
我需要使用gulp来更新资源引用或者可能使用不同的插件?
解决方法
使用
gulp-replace plugin我们可以连接bower_components assests.
例如:
var replace = require('gulp-replace'); gulp.task('fix-paths',['minify'],function() { gulp.src('public/css/site.css') .pipe(replace('../','../bower_components/bootstrap/dist/')) .pipe(gulp.dest('public/css')); });