search

ppoffice / hexo-theme-icarus

A simple, delicate, and modern theme for the static site generator Hexo.
https://ppoffice.github.io/hexo-theme-icarus/
MIT License
6.35k stars 1.54k forks source link

网站显示诡异 #684

Closed TLHorse closed 4 years ago

TLHorse commented 4 years ago

我从matery主题换成icarus后，先下载了几个依赖，然后设了一下configyml，之后网站变成：

截屏

文字之间有许多奇怪的黑块，还有许多黑线，恶心得不行。我哪里配置错了？求教 _config.yml:

# Version of the configuration file
version: 3.0.0
# Icarus theme variant, can be "default" or "cyberpunk"
variant: default
# Path or URL to the website's logo
logo: /img/logo.svg
# Page metadata configurations
head:
    # URL or path to the website's icon
    favicon: /img/favicon.svg
    # Open Graph metadata
    # https://hexo.io/docs/helpers.html#open-graph
    open_graph:
        # Page title (og:title) (optional)
        # You should leave this blank for most of the time
        title: 
        # Page type (og:type) (optional)
        # You should leave this blank for most of the time
        type: blog
        # Page URL (og:url) (optional)
        # You should leave this blank for most of the time
        url: 
        # Page cover (og:image) (optional) Default to the Open Graph image or thumbnail of the page
        # You should leave this blank for most of the time
        image: 
        # Site name (og:site_name) (optional)
        # You should leave this blank for most of the time
        site_name: 
        # Page author (article:author) (optional)
        # You should leave this blank for most of the time
        author: 
        # Page description (og:description) (optional)
        # You should leave this blank for most of the time
        description: 
        # Twitter card type (twitter:card)
        twitter_card: 
        # Twitter ID (twitter:creator)
        twitter_id: 
        # Twitter ID (twitter:creator)
        twitter_site: 
        # Google+ profile link (deprecated)
        google_plus: 
        # Facebook admin ID
        fb_admins: 
        # Facebook App ID
        fb_app_id: 
    # Structured data of the page
    # https://developers.google.com/search/docs/guides/intro-structured-data
    structured_data:
        # Page title (optional)
        # You should leave this blank for most of the time
        title: 
        # Page description (optional)
        # You should leave this blank for most of the time
        description: 
        # Page URL (optional)
        # You should leave this blank for most of the time
        url: 
        # Page author (article:author) (optional)
        # You should leave this blank for most of the time
        author: 
        # Page images (optional) Default to the Open Graph image or thumbnail of the page
        # You should leave this blank for most of the time
        image: 
    # Additional HTML meta tags in an array
    meta:
        # Meta tag specified in <attribute>=<value> style
        # E.g., name=theme-color;content=#123456 => <meta name="theme-color" content="#123456">
        - ''
    # URL or path to the website's RSS atom.xml
    rss: 
# Page top navigation bar configurations
navbar:
    # Naviagtion menu items
    menu:
        Home: /
        Archives: /archives
        Categories: /categories
        Tags: /tags
        About: /about
    # Links to be shown on the right of the navigation bar
    links:

# Page footer configurations
footer:
    # Links to be shown on the right of the footer section
    links:
        Creative Commons:
            icon: fab fa-creative-commons
            url: 'https://creativecommons.org/'
        Attribution 4.0 International:
            icon: fab fa-creative-commons-by
            url: 'https://creativecommons.org/licenses/by/4.0/'

# Article related configurations
article:
    # Code highlight settings
    highlight:
        # Code highlight themes
        # https://github.com/highlightjs/highlight.js/tree/master/src/styles
        theme: atom-one-light
        # Show copy code button
        clipboard: true
        # Default folding status of the code blocks. Can be "", "folded", "unfolded"
        fold: unfolded
    # Whether to show thumbnail image for every article
    thumbnail: true
    # Whether to show estimated article reading time
    readtime: true
# Search plugin configurations
# https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Search/
search:
    type: insight
# Comment plugin configurations
# https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Comment/
comment:
    type: livere
    uid: MTAyMC80ODQzOS8yNDkzMw==
# Donate plugin configurations
# https://blog.zhangruipeng.me/hexo-theme-icarus/categories/Plugins/Donation/
donates:
    # Alipay donate button configurations
    -
        type: alipay
        # Alipay qrcode image URL
        qrcode: ''
    # "Buy me a coffee" donate button configurations
    -
        type: buymeacoffee
        # URL to the "Buy me a coffee" page
        url: ''
    # Patreon donate button configurations
    -
        type: patreon
        # URL to the Patreon page
        url: ''
    # Paypal donate button configurations
    -
        type: paypal
        # Paypal business ID or email address
        business: ''
        # Currency code
        currency_code: USD
    # Wechat donate button configurations
    -
        type: wechat
        # Wechat qrcode image URL
        qrcode: ''
# Share plugin configurations
# https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/Share/
share:
    type: sharethis
    # URL to the ShareThis share plugin script
    install_url: ''
# Sidebar configurations.
# Please be noted that a sidebar is only visible when it has at least one widget
sidebar:
    # Left sidebar configurations
    left:
        # Whether the sidebar sticks to the top when page scrolls
        sticky: false
    # Right sidebar configurations
    right:
        # Whether the sidebar sticks to the top when page scrolls
        sticky: false
# Sidebar widget configurations
# http://ppoffice.github.io/hexo-theme-icarus/categories/Widgets/
widgets:
    # Profile widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: left
        type: profile
        # Author name
        author: TLHorse
        # Author title
        author_title: 学生
        # Author's current location
        location: 地球，太阳系
        # URL or path to the avatar image
        avatar: 
        # Whether show the rounded avatar image
        avatar_rounded: false
        # Email address for the Gravatar
        gravatar: 
        # URL or path for the follow button
        follow_link: 'https://github.com/TLHorse'
        # Links to be shown on the bottom of the profile widget
        social_links:
            Github:
                icon: fab fa-github
                url: 'https://github.com/TLHorse'
            Email:
                icon: fas fa-mail-bulk
                url: 'mailto:matianlaialex@sina.com'
    # Table of contents widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: right
        type: toc
    # Recommendation links widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: left
        type: links
        # Names and URLs of the sites
        links:
            Hexo: 'https://hexo.io'
            GitHub: 'https://github.com'
    # Categories widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: left
        type: categories
    # Recent posts widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: right
        type: recent_posts
    # Archives widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: right
        type: archives
    # Tags widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: right
        type: tags
    # Google FeedBurner email subscription widget configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: left
        type: subscribe_email
        # Hint text under the email input
        description: 
        # Feedburner ID
        feedburner_id: ''
    # Google AdSense unit configurations
    -
        # Where should the widget be placed, left sidebar or right sidebar
        position: left
        type: adsense
        # AdSense client ID
        client_id: ''
        # AdSense AD unit ID
        slot_id: ''
# Plugin configurations
# https://ppoffice.github.io/hexo-theme-icarus/categories/Plugins/
plugins:
    # Enable page startup animations
    animejs: true
    # Show the "back to top" button
    back_to_top: true
    # Baidu Analytics plugin settings
    # https://tongji.baidu.com
    baidu_analytics:
        # Baidu Analytics tracking ID
        tracking_id: 
    # BuSuanZi site/page view counter
    # https://busuanzi.ibruce.info
    busuanzi: false
    # CNZZ statistics
    # https://www.umeng.com/web
    cnzz:
        # CNZZ tracker id
        id: 
        # CNZZ website id
        web_id: 
    # Enable the lightGallery and Justified Gallery plugins
    gallery: true
    # Google Analytics plugin settings
    # https://analytics.google.com
    google_analytics:
        # Google Analytics tracking ID
        tracking_id: 
    # Hotjar user feedback plugin
    # https://www.hotjar.com/
    hotjar:
        # Hotjar site id
        site_id: 
    # Enable the KaTeX math typesetting supprot
    # https://katex.org/
    katex: false
    # Enable the MathJax math typesetting support
    # https://www.mathjax.org/
    mathjax: false
    # Enable the Outdated Browser plugin
    # http://outdatedbrowser.com/
    outdated_browser: false
    # Show a progress bar at top of the page on page loading
    progressbar: true
# CDN provider settings
# https://ppoffice.github.io/hexo-theme-icarus/Configuration/Theme/speed-up-your-site-with-custom-cdn/
providers:
    # Name or URL template of the JavaScript and/or stylesheet CDN provider
    cdn: jsdelivr
    # Name or URL template of the webfont CDN provider
    fontcdn: google
    # Name or URL of the fontawesome icon font CDN provider
    iconcdn: fontawesome
ppoffice commented 4 years ago

@TLHorse hexo clean了没有？

TLHorse commented 4 years ago

@TLHorse hexo clean了没有？

都clean了无数遍了～ 是不是因为有些库没有安装？

ppoffice commented 4 years ago

@TLHorse 也有可能是浏览器缓存的问题，或者你之前安装了什么其他的Hexo插件引起的。请检查根目录下的package.json并尝试删除node_modules和npm install。

TLHorse commented 4 years ago

你的意思是将node_modules文件夹手动删除，然后再cd到博客目录，然后npm install？你确定我的博客会没事吗？

另外，刚才强刷了localhost:4000的缓存，没有解决问题。：（

ppoffice commented 4 years ago

cd到博客目录 -> 将node_modules文件夹手动删除 -> npm install 你要是觉着可能有事你就备份一份

TLHorse commented 4 years ago

cd到博客目录 -> 将node_modules文件夹手动删除 -> npm install 你要是觉着可能有事你就备份一份

我刚才试了一遍，结果还是没解决问题。。。我只想呵呵。。。 是时候放弃这个主题吗。。。可我不想放弃欸。。。还有什么办法吗？

TLHorse commented 4 years ago

安装中倒是有一段错误提示，不知道能不能说明问题：

gyp WARN EACCES current user ("MaTianlai") does not have permission to access the dev dir "/var/root/Library/Caches/node-gyp/12.16.2"
gyp WARN EACCES attempting to reinstall using temporary dev dir "/Users/MaTianlai/Documents/TLHorse_Blog/node_modules/hexo-abbrlink/node_modules/fsevents/.node-gyp"
gyp WARN install got an error, rolling back install
gyp WARN install got an error, rolling back install
gyp ERR! configure error 
gyp ERR! stack Error: EACCES: permission denied, mkdir '/Users/MaTianlai/Documents/TLHorse_Blog/node_modules/hexo-abbrlink/node_modules/fsevents/.node-gyp'
gyp ERR! System Darwin 19.3.0
gyp ERR! command "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild"
gyp ERR! cwd /Users/MaTianlai/Documents/TLHorse_Blog/node_modules/hexo-abbrlink/node_modules/fsevents
gyp ERR! node -v v12.16.2
gyp ERR! node-gyp -v v5.1.0
gyp ERR! not ok 

> fsevents@1.2.12 install /Users/MaTianlai/Documents/TLHorse_Blog/node_modules/hexo-prism-plugin/node_modules/fsevents
> node-gyp rebuild

gyp WARN EACCES current user ("MaTianlai") does not have permission to access the dev dir "/var/root/Library/Caches/node-gyp/12.16.2"
gyp WARN EACCES attempting to reinstall using temporary dev dir "/Users/MaTianlai/Documents/TLHorse_Blog/node_modules/hexo-prism-plugin/node_modules/fsevents/.node-gyp"
gyp WARN install got an error, rolling back install
gyp WARN install got an error, rolling back install
gyp ERR! configure error 
gyp ERR! stack Error: EACCES: permission denied, mkdir '/Users/MaTianlai/Documents/TLHorse_Blog/node_modules/hexo-prism-plugin/node_modules/fsevents/.node-gyp'
gyp ERR! System Darwin 19.3.0
gyp ERR! command "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "rebuild"
gyp ERR! cwd /Users/MaTianlai/Documents/TLHorse_Blog/node_modules/hexo-prism-plugin/node_modules/fsevents
gyp ERR! node -v v12.16.2
gyp ERR! node-gyp -v v5.1.0
gyp ERR! not ok 

> ejs@2.7.4 postinstall /Users/MaTianlai/Documents/TLHorse_Blog/node_modules/ejs
> node ./postinstall.js

Thank you for installing EJS: built with the Jake JavaScript build tool (https://jakejs.com/)

> inferno@7.4.2 postinstall /Users/MaTianlai/Documents/TLHorse_Blog/node_modules/inferno
> opencollective-postinstall

Thank you for using inferno!
If you rely on this package, please consider supporting our open collective:
> https://opencollective.com/inferno/donate

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.12 (node_modules/hexo-abbrlink/node_modules/fsevents):
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.12 install: `node-gyp rebuild`
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: Exit status 1
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.12 (node_modules/hexo-prism-plugin/node_modules/fsevents):
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.12 install: `node-gyp rebuild`
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: Exit status 1
TLHorse commented 4 years ago

不过我发现这个问题是时有时无的，比如到我的作文category里就没有：

截屏2020-04-15上午11 20 26

但是到计算机category理就会出现问题：

截屏2020-04-15上午11 20 57
ppoffice commented 4 years ago

@TLHorse 对照这里排查下：https://github.com/ppoffice/hexo-theme-icarus/blob/site/package.json

TLHorse commented 4 years ago

https://github.com/ppoffice/hexo-theme-icarus/blob/site/package.json 里的库都是必须安装的吗？

ppoffice commented 4 years ago

hexo-algolia和hexo-filter-github-emojis不用

TLHorse commented 4 years ago

好像都全着呢。我的package.json：

{
  "name": "hexo-site",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "build": "hexo generate",
    "clean": "hexo clean",
    "deploy": "hexo deploy",
    "server": "hexo server"
  },
  "hexo": {
    "version": "4.2.0"
  },
  "dependencies": {
    "bulma-stylus": "^0.8.0",
    "hexo": "^4.0.0",
    "hexo-abbrlink": "^2.0.5",
    "hexo-component-inferno": "^0.2.4",
    "hexo-deployer-git": "^2.1.0",
    "hexo-generator-archive": "^1.0.0",
    "hexo-generator-category": "^1.0.0",
    "hexo-generator-index": "^1.0.0",
    "hexo-generator-search": "^2.4.0",
    "hexo-generator-tag": "^1.0.0",
    "hexo-prism-plugin": "^2.3.0",
    "hexo-renderer-ejs": "^1.0.0",
    "hexo-renderer-inferno": "^0.1.3",
    "hexo-renderer-marked": "^2.0.0",
    "hexo-renderer-stylus": "^1.1.0",
    "hexo-server": "^1.0.0",
    "hexo-wordcount": "^6.0.1",
    "inferno": "^7.4.2",
    "inferno-create-element": "^7.4.2"
  }
}

注：wordcount和abbrlink是我自己加的

TLHorse commented 4 years ago

我怎么改都不行，气死我了 你说这跟暗黑模式有关系吗？

ppoffice commented 4 years ago

@TLHorse 把这个去掉试试"hexo-prism-plugin": "^2.3.0",

TLHorse commented 4 years ago

@TLHorse 把这个去掉试试"hexo-prism-plugin": "^2.3.0",

我运行了一下npm uninstall hexo-prism-plugin，果然成功了！ 我分析的原因是，hexo-prism-plugin库是一个给代码上色的库，但是它把网站里所有文字都变成了代码。只要把它去掉就不会出现黑块（代码块）了。