...
|
...
|
@@ -5,15 +5,15 @@ module.exports = { |
|
|
/**
|
|
|
* 分离 CSS
|
|
|
* @param {*} $
|
|
|
* @param {*} prefix
|
|
|
* @param {*} option
|
|
|
*/
|
|
|
processStyle($, prefix) {
|
|
|
processStyle($, option) {
|
|
|
let css = [];
|
|
|
|
|
|
$('*').each(function(index) {
|
|
|
let $this = $(this);
|
|
|
let localStyle = $this.attr('style');
|
|
|
let className = `yoho-inline-style-${prefix}-${index}`;
|
|
|
let className = `yoho-inline-style-${option.prefix}-${index}`;
|
|
|
|
|
|
if (localStyle) {
|
|
|
css.push(`.${className}{${localStyle}}`);
|
...
|
...
|
@@ -28,13 +28,13 @@ module.exports = { |
|
|
* 替换标签
|
|
|
* @param {*} $
|
|
|
*/
|
|
|
processTag($, prefix) {
|
|
|
processTag($, option) {
|
|
|
let css = [];
|
|
|
|
|
|
// mip-anim
|
|
|
$('img[src*=".gif"]').each(function() {
|
|
|
let $this = $(this);
|
|
|
let mipAnim = `<mip-anim layout="responsive" width="350" height="263" src="${$this.attr('src')}" alt="${$this.attr('alt') || ''}" class="${$this.attr('class') || ''}"></mip-anim>`; // eslint-disable-line
|
|
|
let mipAnim = `<mip-anim layout="container" src="${$this.attr('src')}" alt="${$this.attr('alt') || ''}" class="${$this.attr('class') || ''}"></mip-anim>`; // eslint-disable-line
|
|
|
|
|
|
$this.replaceWith(mipAnim);
|
|
|
});
|
...
|
...
|
@@ -50,7 +50,7 @@ module.exports = { |
|
|
// mip-video
|
|
|
$('video').each(function() {
|
|
|
let $this = $(this);
|
|
|
let mipVideo = `<mip-video layout="responsive" width="350" height="263" poster="${$this.attr('poster') || ''}" src="${$this.attr('src')}" alt="${$this.attr('alt') || ''}" class="${$this.attr('class') || ''}"></mip-video>`; // eslint-disable-line
|
|
|
let mipVideo = `<mip-video layout="container" poster="${$this.attr('poster') || ''}" src="${$this.attr('src')}" alt="${$this.attr('alt') || ''}" class="${$this.attr('class') || ''}"></mip-video>`; // eslint-disable-line
|
|
|
|
|
|
$this.replaceWith(mipVideo);
|
|
|
});
|
...
|
...
|
@@ -66,7 +66,7 @@ module.exports = { |
|
|
// mip-iframe
|
|
|
$('iframe').each(function() {
|
|
|
let $this = $(this);
|
|
|
let mipIframe = `<mip-iframe layout="responsive" width="350" height="263" src="${$this.attr('src')}" class="${$this.attr('class') || ''}"></mip-iframe>`; // eslint-disable-line
|
|
|
let mipIframe = `<mip-iframe layout="container" src="${$this.attr('src')}" class="${$this.attr('class') || ''}"></mip-iframe>`; // eslint-disable-line
|
|
|
|
|
|
$this.replaceWith(mipIframe);
|
|
|
});
|
...
|
...
|
@@ -80,7 +80,7 @@ module.exports = { |
|
|
});
|
|
|
|
|
|
// mip-link
|
|
|
if (prefix.mipLint) {
|
|
|
if (option.mipLink) {
|
|
|
$('a').each(function() {
|
|
|
let $this = $(this);
|
|
|
let mipLink = `<a data-type="mip" class="${$this.attr('class') || ''}"
|
...
|
...
|
@@ -107,17 +107,17 @@ module.exports = { |
|
|
/**
|
|
|
* 处理 HTML 为 MIP 所需要的格式
|
|
|
* @param {*} html HTML
|
|
|
* @param {*} prefix CSS 前缀
|
|
|
* @param {*} option.prefix CSS 前缀
|
|
|
*/
|
|
|
|
|
|
process(html = '', prefix = 0) {
|
|
|
process(html = '', option = '') {
|
|
|
html = _.isString(html) ? html : '';
|
|
|
|
|
|
let $ = cheerio.load(html, {
|
|
|
decodeEntities: false
|
|
|
});
|
|
|
let inlineStyle = this.processStyle($, prefix); // 必须先处理内联样式
|
|
|
let tagHtml = this.processTag($, prefix);
|
|
|
let inlineStyle = this.processStyle($, option); // 必须先处理内联样式
|
|
|
let tagHtml = this.processTag($, option);
|
|
|
|
|
|
return {
|
|
|
mipHtml: tagHtml.mipHtml,
|
...
|
...
|
|