Skip to content
This repository was archived by the owner on Mar 23, 2021. It is now read-only.

Commit 9cf3436

Browse files
tonyc726tonyc726
committed
perf: 使用ES6重构，并且增加配置参数，方便后期扩展
1 parent 5b80b60 commit 9cf3436

File tree

3 files changed

+213
-14
lines changed

3 files changed

+213
-14
lines changed

‎README.md

Lines changed: 73 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,81 @@
1-
#fis3-deploy-html-minifier
2-
A plugin for [fis3](http://fis.baidu.com/) using [html-minifier](https://github.com/kangax/html-minifier) in deploy.
1+
# fis3-deploy-html-minifier -- A fis3 plugin to compress file with html-minifier on deploy stage.
2+
[![npm](https://img.shields.io/npm/v/fis3-deploy-html-minifier.svg?style=flat-square)](https://github.com/tonyc726/fis3-deploy-html-minifier)
3+
[![Build Status](https://travis-ci.org/tonyc726/fis3-deploy-html-minifier.svg?style=flat-square&branch=master)](https://travis-ci.org/tonyc726/fis3-deploy-html-minifier)
4+
[![bitHound Code](https://www.bithound.io/github/tonyc726/fis3-deploy-html-minifier/badges/code.svg)](https://www.bithound.io/github/tonyc726/fis3-deploy-html-minifier)
5+
[![license](https://img.shields.io/github/license/mashape/apistatus.svg?style=flat-square)](https://github.com/tonyc726/fis3-deploy-html-minifier)
36

4-
## Usage
7+
> Thanks for [fis3-deploy-i18n-template](https://github.com/foio/fis3-deploy-i18n-template)
58
6-
### fis-conf.js
9+
在前端的工程构建工具[FIS3](http://fis.baidu.com/)发布阶段，将`modified`中命中`templatePattern`规则，或者未设置`templatePattern`，但是拥有`isHtmlLike: true`的文件，使用 [html-minifier](https://github.com/kangax/html-minifier) 进行压缩。
710

8-
``` javascript
11+
## 使用说明
12+
### 如何安装
13+
```shell
14+
yarn add fis3-deploy-html-minifier -D
15+
# OR
16+
npm install fis3-deploy-html-minifier -D
17+
```
918

10-
fis.match('*.tpl', {
11-
isHtmlLike: true
12-
});
19+
### 默认配置
20+
```javascript
21+
/**
22+
* @type {Object} DEFAULT_CONFIG - 插件默认配置
23+
* @property {string} [templatePattern=''] - 需要做多语言处理文件subpath的glob规则，默认为所有html文件
24+
* @property {string} [ignorePattern=''] - 需要忽略编译的glob规则
25+
* @property {...object} minifyOptions - html-minifiers的配置项，具体的可以参考[options-quick-reference](https://github.com/kangax/html-minifier#options-quick-reference)
26+
*/
27+
{
28+
templatePattern: '',
29+
ignorePattern: '',
30+
...minifierOptions,
31+
};
32+
```
33+
34+
## 参考示例
35+
36+
### 项目目录结构
37+
```
38+
# project root path
39+
│
40+
├── template-folder
41+
│ ├── index.html
42+
│ ├── _not_compress.html
43+
│ ├── ...
44+
│ └── sub-folder
45+
│ ├── detail.html
46+
│ └── ...
47+
│
48+
├── fis-conf.js
49+
│
50+
└── package.json
51+
```
1352

53+
### 配置`fis-conf.js`中`fis3-deploy-html-minifier`相关的内容
54+
``` javascript
55+
// ------ templates ------
56+
fis.match('/template-folder/(**)/(*.html)', {
57+
release: '/$1/$2'
58+
});
59+
// ------ deploy ------
1460
fis.match('**', {
15-
deploy: [
16-
fis.plugin('html-minifier', {
17-
// html-minifier options
18-
// https://github.com/kangax/html-minifier#options-quick-reference
19-
}
20-
)
61+
deploy: [
62+
fis.plugin('html-minifier', {
63+
templatePattern: '',
64+
i18nPattern: '/template-folder/**/_*.html',
65+
}),
66+
]
2167
});
2268
```
69+
70+
71+
## 参考
72+
- [node-project-kit](https://github.com/tonyc726/node-project-kit) - 快速创建项目的模板
73+
- [glob](https://github.com/isaacs/node-glob) - 使用glob语法获取匹配文件的工具
74+
- [html-minifier](https://github.com/kangax/html-minifier) - html压缩工具
75+
76+
## License
77+
Copyright © 2017-present. This source code is licensed under the MIT license found in the
78+
[LICENSE](https://github.com/tonyc726/fis3-deploy-html-minifier/blob/master/LICENSE) file.
79+
80+
---
81+
Made by Tony ([blog](https://itony.net))

‎dist/index.js

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
7+
var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
8+
9+
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
10+
11+
var _forEach2 = require('lodash/forEach');
12+
13+
var _forEach3 = _interopRequireDefault(_forEach2);
14+
15+
var _merge2 = require('lodash/merge');
16+
17+
var _merge3 = _interopRequireDefault(_merge2);
18+
19+
var _htmlMinifier = require('html-minifier');
20+
21+
var _isGlob = require('is-glob');
22+
23+
var _isGlob2 = _interopRequireDefault(_isGlob);
24+
25+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
26+
27+
var DEFAULT_CONFIG = {
28+
templatePattern: '',
29+
ignorePattern: ''
30+
};
31+
32+
exports.default = function (options, modified, total, fisDeployNextEvent) {
33+
var config = (0, _merge3.default)(DEFAULT_CONFIG, options);
34+
var templatePattern = config.templatePattern,
35+
ignorePattern = config.ignorePattern,
36+
minifyOptions = (0, _objectWithoutProperties3.default)(config, ['templatePattern', 'ignorePattern']);
37+
38+
var isTemplatePatternGlobVerified = (0, _isGlob2.default)(templatePattern);
39+
var isIgnorePatternGlobVerified = (0, _isGlob2.default)(ignorePattern);
40+
41+
(0, _forEach3.default)(modified, function (modifiedFile) {
42+
if (modifiedFile.release && (!isTemplatePatternGlobVerified ? modifiedFile.isHtmlLike : fis.util.glob(templatePattern, modifiedFile.subpath)) && isIgnorePatternGlobVerified && !fis.util.glob(ignorePattern, modifiedFile.subpath)) {
43+
var fileContent = modifiedFile.getContent();
44+
modifiedFile.setContent((0, _htmlMinifier.minify)(fileContent, minifyOptions));
45+
}
46+
});
47+
48+
fisDeployNextEvent();
49+
};
50+
51+
module.exports = exports['default'];

‎src/index.js

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
/**
2+
* A FIS3 plugin to generate html file with i18n data in deploy stage
3+
* Copyright (c) 2017
4+
* All rights reserved
5+
*
6+
* Author: [email protected]
7+
*/
8+
9+
import { minify } from 'html-minifier';
10+
import isGlob from 'is-glob';
11+
import { merge, forEach } from 'lodash';
12+
13+
/**
14+
* @type {Object} DEFAULT_CONFIG - 插件默认配置
15+
* @property {string} [templatePattern=''] - 需要做多语言处理文件subpath的glob规则，默认为所有html文件
16+
* @property {string} [ignorePattern=''] - 需要忽略编译的glob规则
17+
* @property {...object} minifyOptions - html-minifiers的配置项，具体的可以参考[options-quick-reference](https://github.com/kangax/html-minifier#options-quick-reference)
18+
*/
19+
const DEFAULT_CONFIG = {
20+
templatePattern: '',
21+
ignorePattern: '',
22+
};
23+
24+
/**
25+
* FIS3 deploy i18n plugin
26+
*
27+
* http://fis.baidu.com/fis3/docs/api/dev-plugin.html
28+
* @param {object} options - 插件配置
29+
* @param {object} modified - 修改了的文件列表（对应watch功能）
30+
* @param {object} total - 所有文件列表
31+
* @param {function} next - 调用下一个插件
32+
* @return {undefined}
33+
*/
34+
export default (options, modified, total, fisDeployNextEvent) => {
35+
const config = merge(DEFAULT_CONFIG, options);
36+
const { templatePattern, ignorePattern, ...minifyOptions } = config;
37+
const isTemplatePatternGlobVerified = isGlob(templatePattern);
38+
const isIgnorePatternGlobVerified = isGlob(ignorePattern);
39+
/**
40+
* @see http://fis.baidu.com/fis3/api/fis.file-File.html
41+
*
42+
* @param {string} modifiedFile.ext - 文件名后缀
43+
* @param {string} modifiedFile.filename - 文件名，没有后缀
44+
* @param {string} modifiedFile.basename - 文件名
45+
* @param {string} modifiedFile.realpath - 文件物理地址
46+
* @param {string} modifiedFile.realpathNoExt - 文件物理地址，没有后缀
47+
* @param {string} modifiedFile.subpath - 文件基于项目 root 的绝对路径
48+
* @param {string} modifiedFile.subdirname - 文件基于项目 root 的绝对路径，仅文件夹目录
49+
* @param {string} modifiedFile.subpathNoExt - 文件基于项目 root 的绝对路径，没有后缀
50+
* @param {string | boolean} modifiedFile.release - 文件的发布路径，当值为 false 时，文件不会发布
51+
*
52+
* @example
53+
*
54+
* [{
55+
* "ext": ".fileExt",
56+
* "filename": "fileName",
57+
* "basename": "fileName.fileExt",
58+
* "realpath": "/projectRootPath/fileParentDirPath/fileName.fileExt",
59+
* "realpathNoExt": "/projectRootPath/fileParentDirPath/fileName",
60+
* "subpath": "/fileParentDirPath/fileName.fileExt",
61+
* "subdirname": "/fileParentDirPath",
62+
* "subpathNoExt": "/fileParentDirPath/fileName",
63+
* "release": "/fileParentDirPath/fileName.fileExt",
64+
* }...]
65+
*/
66+
forEach(modified, (modifiedFile) => {
67+
if (
68+
modifiedFile.release &&
69+
(
70+
// 如果没有过滤的正则，则依据`isHtmlLike`来鉴别
71+
(!isTemplatePatternGlobVerified) ?
72+
modifiedFile.isHtmlLike :
73+
// eslint-disable-next-line no-undef
74+
fis.util.glob(templatePattern, modifiedFile.subpath)
75+
) &&
76+
(
77+
isIgnorePatternGlobVerified &&
78+
// eslint-disable-next-line no-undef
79+
!fis.util.glob(ignorePattern, modifiedFile.subpath)
80+
)
81+
) {
82+
const fileContent = modifiedFile.getContent();
83+
modifiedFile.setContent(minify(fileContent, minifyOptions))
84+
}
85+
});
86+
87+
// 由于是异步的如果后续还需要执行必须调用 fisDeployNextEvent
88+
fisDeployNextEvent();
89+
};

0 commit comments

Comments
 (0)