Gulp 和 Bower - 创建正确的文件结构
Gulp and Bower - creating proper files structure
我正在将 Bower 添加到已经在使用 Gulp 的项目中。我的文件夹结构如下:
|- bower_components
| |- dependency1
| | |- dist
| | |- lib1.js
| | |- lib1.min.js
| |
| |- dependency2
| |- core
| |- sub
| | |- extra.js
| |
| |- lib2.js
|
|- target
|- js
我已经使用 main-bower-files and bower-normalize 将所有第 3 方库复制到 target/js。但它变平了(而且我没有将 bower-normalize 选项 flatten
设置为 true!),所以它看起来像:
target
|- js
|- lib1.js
|- extra.js
|- lib2.js
文件 lib1.js
、extra.js
和 lib2.js
在 bower.json 配置文件中标记为 main
。
我想要实现的是文件结构如下:
target
|- js
|- dependency1
| |- lib1.js
|
|- dependency2
|- sub
| |- extra.js
|
|- lib2.js
我将不胜感激!
Go through gulp-flatten,
this will help you to remove or replace relative path for files. And
also, I highly recommend
wiredep. It automatically
handles all of your bower dependencies for you, as well as the order
of the dependencies. Hope this will help you.
包含 Bower 组件的源目录:
|- bower_components
| |- dependency1
| | |- dist
| | |- lib1.js
| | |- lib1.min.js
| |
| |- dependency2
| |- core
| |- sub
| | |- extra.js
| |
| |- lib2.js
|
|- target
|- js
使用 gulp-展平 -
gulp.src(['bower_components/**/*.js'])
.pipe(flatten({ includeParents: [1, 1]} ))
.pipe(gulp.dest('build/'));
将创建这个结构(从上面的树目录):
|- bower_components
| |- dependency1
| | |- lib1.js
| |
| |- dependency2
| |- sub
| | |- extra.js
| |
| |- lib2.js
includeParents: [1, 1]
如果作为两个数字的数组传递,则顶部和底部的父项都将保留在文件的结果路径中。
includeParents: 1
如果以正数传入,则输出中将包含顶层父级的数量。
includeParents: -1
如果传入负数,则输出中包含底层父级的个数。
我正在将 Bower 添加到已经在使用 Gulp 的项目中。我的文件夹结构如下:
|- bower_components
| |- dependency1
| | |- dist
| | |- lib1.js
| | |- lib1.min.js
| |
| |- dependency2
| |- core
| |- sub
| | |- extra.js
| |
| |- lib2.js
|
|- target
|- js
我已经使用 main-bower-files and bower-normalize 将所有第 3 方库复制到 target/js。但它变平了(而且我没有将 bower-normalize 选项 flatten
设置为 true!),所以它看起来像:
target
|- js
|- lib1.js
|- extra.js
|- lib2.js
文件 lib1.js
、extra.js
和 lib2.js
在 bower.json 配置文件中标记为 main
。
我想要实现的是文件结构如下:
target
|- js
|- dependency1
| |- lib1.js
|
|- dependency2
|- sub
| |- extra.js
|
|- lib2.js
我将不胜感激!
Go through gulp-flatten, this will help you to remove or replace relative path for files. And also, I highly recommend wiredep. It automatically handles all of your bower dependencies for you, as well as the order of the dependencies. Hope this will help you.
包含 Bower 组件的源目录:
|- bower_components
| |- dependency1
| | |- dist
| | |- lib1.js
| | |- lib1.min.js
| |
| |- dependency2
| |- core
| |- sub
| | |- extra.js
| |
| |- lib2.js
|
|- target
|- js
使用 gulp-展平 -
gulp.src(['bower_components/**/*.js'])
.pipe(flatten({ includeParents: [1, 1]} ))
.pipe(gulp.dest('build/'));
将创建这个结构(从上面的树目录):
|- bower_components
| |- dependency1
| | |- lib1.js
| |
| |- dependency2
| |- sub
| | |- extra.js
| |
| |- lib2.js
includeParents: [1, 1]
如果作为两个数字的数组传递,则顶部和底部的父项都将保留在文件的结果路径中。
includeParents: 1
如果以正数传入,则输出中将包含顶层父级的数量。
includeParents: -1
如果传入负数,则输出中包含底层父级的个数。