https://github.com/phpple/gulp-ya-merge
gulp merge html's css and js
https://github.com/phpple/gulp-ya-merge
Last synced: 4 months ago
JSON representation
gulp merge html's css and js
- Host: GitHub
- URL: https://github.com/phpple/gulp-ya-merge
- Owner: phpple
- Created: 2016-08-10T09:13:16.000Z (almost 10 years ago)
- Default Branch: master
- Last Pushed: 2016-09-23T07:31:51.000Z (over 9 years ago)
- Last Synced: 2025-09-21T13:34:34.531Z (9 months ago)
- Language: JavaScript
- Size: 10.7 KB
- Stars: 1
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# gulp-ya-merge
`gulp-ya-merge`并不用来压缩静态文件,而是用于在静态文件被压缩后,对html页面引用的的静态文件进行合并和追加文件版本等操作。
## 用法
```js
var destDir = "dist";
var merge = require('gulp-ya-merge');
var options = {
rootPath: process.cwd() + '/share/static/'
};
gulp.task('merge', function () {
gulp.src('mall/**/*.phtml')
.pipe(merge(options))
.pipe(gulp.dest('/dest/mall/'));
});
```
## 选项
`gulp-ya-merge`可传入一个对象作为参数,选项的可选值如下：
| 参数 | 说明 | 默认值 |
|--------------|-----------------------------------------------------------------------------------------|--------------|
| `rootPath` | 静态文件的根目录 | 当前目录 |
| `leftFlag` | 合并区间代码的起始标识 | |
| `newPath` | 合并后要替换的地址。{$base}代表目录及文件名（不包括后缀），{$stamp}代表文件版本号，{$ext}代表文件的后缀 | =$this->StaticUrl(\'{$base}-{$stamp}{$ext}\')?> |
| `hashLength` | 文件版本号的长度 | 8 |
| `scriptExp` | 要替换的非合并的script标签的正则表达式 | /(StaticUrl\([\'\"])([^\'\"\-]+)([\'\"]\)(?:[^\/]*)><\/script>)/gm |
| `linkExp` | 要替换的非合并的link标签的正则表达式 | /(<link\s(?:.*)\$this->StaticUrl\([\'\"])([^\'\"\-]+)([\'\"]\)(?:[^\/]*)(?:\/?>|<\/link>))/gm |
需要注意的是：
`scriptExp`和`linkExp`需要包括3对小括号，第1对小括号表示静态文件前面的匹配内容，第2对小括号表示静态文件的网址，第3对小括号表示静态文件后面的匹配内容。
## 语法规则
下面用${xxx}表示上面的配置项,归结html代码的规则如下:
```html
{$leftFlag}{$flag1} {$destPath1}.js{$rightFlag}
{scriptExp}
{$leftFlag}{$flag1}{$rightFlag}
{$leftFlag}{$flag2} {$destPath2}.css{$rightFlag}
{linkExp}
{$leftFlag}{$flag2}{$rightFlag}
{$scriptExp}
{$linkExp}
```
最后将变成如下的代码:
```html
<script src="{$destPath1}-{$stamp1}.js">
```
## 示例
```php
v['mobileUrl'])): ?>
v['is_seo_tag']) && !empty($this->v['is_seo_tag'])): ?>
```
经过`gulp-ya-merge`的处理，最后变成了如下代码：
```php
v['mobileUrl'])): ?>
v['is_seo_tag']) && !empty($this->v['is_seo_tag'])): ?>
```