经过多年的贫困 - 平庸的PHP开发人员,我决定开始我的游戏并学习更多关于开发Web应用程序的现代工作流程和最佳实践。
我研究过任务运行器,依赖管理器,git和云服务器。我主要在PC上工作,我决定与
达成和解我在这里使用了一些答案来弄清楚如何更改位置凉亭,例如,放置它下载的文件但是我很难理解当你使用依赖管理器时最好的做法是什么(似乎下载一个完整的git repo)和一个任务运行器。
例如,我可以告诉bower将jquery或bootstrap下载到src / vendor文件夹中,但下载的内容是javascript,css和其他文件的混合。我可以把它们留在那里并在我的代码中引用它们但是然后运行gulp进程将涉及樱桃挑选单个文件并逐个最小化或连接,避免我不需要的文件夹中的所有其他东西。
这是处理此问题的最佳做法,还是我在错误的球场。我是否应该使用具有依赖关系管理器的任务运行器?
答案 0 :(得分:1)
看看Gulp中的globbing。你应该能够分别使用gulp.src('src/vendor/**/*.css')
和gulp.src('src/vendor/**/*.js')
来挑选你的CSS和JS。
或者,快速搜索NPM会返回一些可能有用的内容:https://www.npmjs.org/package/gulp-bower-files/
答案 1 :(得分:1)
好的,首先关闭蝙蝠 - 让我们谈谈作曲家和凉亭。它不是真正的一种或另一种 - 它更多的是你将它们一起使用。您可以使用composer来管理您的PHP依赖项(例如Guzzle HTTP Client)和bower来管理您的客户端依赖项,例如jQuery bootstrap,a sass mixin library like bourbon或类似{{ 3}}
就凉亭依赖关系和牵引这些依赖关系而言,一种方法是将Font Awesome与Gulp结合使用。这将读取您的bower.json
文件,并根据该文件将bower依赖项拉入您的脚本。如果某些bower依赖项在main
中没有bower.json
属性(有些没有),那么bower-main-files
默认情况下不会选择它们...但是 - 你可以工作通过在您自己的bower.json
文件中提供覆盖来实现此目的:
{
"name": "My Project",
"version": "1.0.0",
"dependencies": {
"autogrow": "https://github.com/ultimatedelman/autogrow.git#master",
"jquery": "1.12.2",
"jquery-slimscroll": "^1.3.7"
},
"overrides": {
"jquery-slimscroll": {
"main": [
"./jquery.slimscroll.js"
]
}
}
}
正如您可能已经注意到的那样,您也可以在github仓库和分支处指向凉亭。
然后,您可以在gulp任务中使用实际的main-bower-files
包本身,如下所示:
var gulp = require("gulp"),
reload = require("browser-sync").reload,
mainBowerFiles = require("main-bower-files")
$ = require("gulp-load-plugins")({
camelize: true
});
gulp.task("vendorScripts", function() {
return gulp.src(mainBowerFiles({filter: '*.js'}))
.pipe($.plumber({
errorHandler: c.onError
}))
.pipe($.concat(c.concatVendorCSSFile))
.pipe(gulp.dest('assets/styles'))
.pipe(reload({stream: true, once: true}))
.pipe($.size({title: "vendorScripts"}));
});
如果您有兴趣,我有一个包含所有这些设置的完整项目Main Bower Files