关于Butterfly最新的3.0.0RC2版本如何魔改出博主、访客、小伙伴的教程

首先我们进行对比

发现3.0.0RC的Valine.pug与其他版本的结构不相同

其它版:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
- let emojiMaps = '""'
if site.data.valine
- emojiMaps = JSON.stringify(site.data.valine)

script.
function loadvaline () {
function requestSetting (from, set) {
var from = from
var setting = set.split(',').filter(function(item){
return from.indexOf(item) > -1
});
setting = setting.length == 0 ? from :setting;
return setting
}

var guestInfo = requestSetting(['nick','mail','link'],'#{ theme.valine.guest_info }')
var requiredFields = requestSetting(['nick','mail'],'#{ theme.valine.requiredFields }')

function initValine () {
window.valine = new Valine({
el:'#vcomment',
appId: '#{theme.valine.appId}',
appKey: '#{theme.valine.appKey}',
path: window.location.pathname,
placeholder: '#{theme.valine.placeholder}',
avatar: '#{theme.valine.avatar}',
meta: guestInfo,
pageSize: '#{theme.valine.pageSize}',
lang: '#{theme.valine.lang}',
recordIP: #{theme.valine.recordIP},
serverURLs: '#{theme.valine.serverURLs}',
emojiCDN: '#{theme.valine.emojiCDN}',
emojiMaps: !{emojiMaps},
enableQQ: #{theme.valine.enableQQ},
requiredFields: requiredFields,
});
}

if (typeof window.valine ==='object') initValine()
else $.getScript('!{url_for(theme.CDN.valine)}', initValine)
}

if ('!{defaultComment}' === 'Valine' || !{theme.comments.load_begin}) {
loadvaline()
}
else {
function loadOtherComment () {
loadvaline()
}
}

RC2版:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
- let emojiMaps = '""'
if site.data.valine
- emojiMaps = JSON.stringify(site.data.valine)

script.
function loadValine () {
function initValine () {
window.valine = new Valine({
el: '#vcomment',
appId: '#{theme.valine.appId}',
appKey: '#{theme.valine.appKey}',
placeholder: '#{theme.valine.placeholder}',
avatar: '#{theme.valine.avatar}',
meta: '#{theme.valine.guest_info }'.split(','),
pageSize: '#{theme.valine.pageSize}',
lang: '#{theme.valine.lang}',
recordIP: #{theme.valine.recordIP},
serverURLs: '#{theme.valine.serverURLs}',
emojiCDN: '#{theme.valine.emojiCDN}',
emojiMaps: !{emojiMaps},
enableQQ: #{theme.valine.enableQQ},
path: window.location.pathname,
});
if ('#{theme.valine.requiredFields}') { valine.config.requiredFields= '#{theme.valine.requiredFields}'.split(',') }
}

if (typeof Valine === 'function') initValine()
else $.getScript('!{url_for(theme.CDN.valine)}', initValine)
}

if ('!{theme.comments.use[0]}' === 'Valine' || !!{theme.comments.lazyload}) {
if (!{theme.comments.lazyload}) loadComment(document.querySelector('#vcomment'),loadValine)
else setTimeout(() => loadValine(), 0)
} else {
function loadOtherComment () {
loadValine()
}
}

可以看到script.下面的内容不一样

这就是不同之处了

这样也就导致部分根据HCLonely博客魔改Valine的用户无法找到魔改的地方

解决其实很简单

在function loadValine的前面加上

1
2
3
4
5
6
7
8
9
10
11
function requestSetting (from, set) {
var from = from
var setting = set.split(',').filter(function(item){
return from.indexOf(item) > -1
});
setting = setting.length == 0 ? from :setting;
return setting
}

var guestInfo = requestSetting(['nick','mail','link'],'#{ theme.valine.guest_info }')
var requiredFields = requestSetting(['nick','mail','link'],'#{ theme.valine.requiredFields }')

即可,然后就可以继续按照HCLonely的魔改教程魔改了。

完结,撒花