Package hexo-asset-image doesn't return correct image path

Yidi0213 commented 2 years ago

Check List

Please check followings before submitting a new issue.

[x] I have already read Docs page & Troubleshooting page
[x] I have already searched existing issues and they are not help to me
[x] I examined error or warning messages and it's difficult to solve
[x] Using the latest version of Hexo (run hexo version to check)
[x] Node.js is higher than minimum required version

Expected behavior

I enablled post_asset_folder and tried embedding image with markdown. After that I should be able to get correct image path with either markdown syntax or tag plugins.

Actual behavior

However I got incorrect file path for both markdown syntax and tag plugins. The stack overflow page describe the problem and gave a solution.

How to reproduce?

Enable post_asset_folder
Follow embedding image with markdown
Create a post and include a image
image won't show up and inspect the image path

Is the problem still there under "Safe mode"?

Environment & Settings

Node.js & npm version(node -v && npm -v)

v16.13.2
8.1.2

Your site _config.yml (Optional)

# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: Yidi's Blog
subtitle: ''
description: ''
keywords:
author: Yidi Wang
language: en
timezone: ''

# URL
## Set your site url here. For example, if you use GitHub Page, set url as 'https://username.github.io/project'
url: https://yidi0213.github.io/blog/
permalink: :year/:month/:day/:title/
permalink_defaults:
pretty_urls:
  trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
  trailing_html: true # Set to false to remove trailing '.html' from permalinks
root: /blog/
# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link:
  enable: true # Open external links in new tab
  field: site # Apply to the whole site
  exclude: ''
filename_case: 0
render_drafts: false
post_asset_folder: true
relative_link: false
future: true
highlight:
  enable: true
  line_number: true
  auto_detect: false
  tab_replace: ''
  wrap: true
  hljs: false
prismjs:
  enable: false
  preprocess: true
  line_number: true
  tab_replace: ''
marked:
  prependRoot: True
  postAsset: True
# Home page setting
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
  path: ''
  per_page: 10
  order_by: -date

# Category & Tag
default_category: uncategorized
category_map:
tag_map:

# Metadata elements
## https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta
meta_generator: true

# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss
## updated_option supports 'mtime', 'date', 'empty'
updated_option: 'mtime'

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

# Include / Exclude file(s)
## include:/exclude: options only apply to the 'source/' folder
include:
exclude:
ignore:

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: purer

# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
  type: git
  repo: https://github.com/Yidi0213/blog

Your theme _config.yml (Optional)

Hexo and Plugin version(npm ls --depth 0)

hexo-site@0.0.0 /Users/yidiwang/Desktop/projects/hexo-practice/blog
├── @iktakahiro/markdown-it-katex@4.0.1
├── hexo-deployer-git@3.0.0
├── hexo-generator-archive@1.0.0
├── hexo-generator-category@1.0.0
├── hexo-generator-index@2.0.0
├── hexo-generator-json-content@4.2.3
├── hexo-generator-tag@1.0.0
├── hexo-image-link@0.0.3
├── hexo-renderer-ejs@2.0.0
├── hexo-renderer-markdown-it@6.0.1
├── hexo-renderer-marked@5.0.0
├── hexo-server@3.0.0
├── hexo-theme-landscape@0.0.3
├── hexo-wordcount@6.0.1
├── hexo@6.1.0
└── markdown-it-emoji@2.0.0

Your package.json package.json

{
  "name": "hexo-site",
  "version": "0.0.0",
  "private": true,
  "scripts": {
    "theme": "cat ./_config.theme.yml > ./themes/purer/_config.yml ",
    "build": "npm run theme && hexo generate",
    "clean": "hexo clean",
    "deploy": "npm run theme && hexo deploy",
    "server": "npm run theme && hexo server"
  },
  "hexo": {
    "version": "6.1.0"
  },
  "dependencies": {
    "@iktakahiro/markdown-it-katex": "^4.0.1",
    "hexo": "^6.0.0",
    "hexo-deployer-git": "^3.0.0",
    "hexo-generator-archive": "^1.0.0",
    "hexo-generator-category": "^1.0.0",
    "hexo-generator-index": "^2.0.0",
    "hexo-generator-json-content": "^4.2.3",
    "hexo-generator-tag": "^1.0.0",
    "hexo-image-link": "^0.0.3",
    "hexo-renderer-ejs": "^2.0.0",
    "hexo-renderer-markdown-it": "^6.0.1",
    "hexo-renderer-marked": "^5.0.0",
    "hexo-server": "^3.0.0",
    "hexo-theme-landscape": "^0.0.3",
    "hexo-wordcount": "^6.0.1",
    "markdown-it-emoji": "^2.0.0"
  }
}

Others

yoshinorin commented 2 years ago

@Yidi0213 Hi. I want to clarify the problem.

Questions

Q1, Your package.json does not include hexo-asset-image. Why do you mention it in the issue title?

Q2. The hexo-image-link plugin is related to this issue? (You are using it)

Q3. Is this problem occur if you are not using the hexo-image-link?

Yidi0213 commented 2 years ago

@yoshinorin Q1 It's on me. I forgot to mention that I already tried the solution posted in the stack overflow by deleting the package hexo-asset-image. After I deleted it, the image path works

Q2 I ran the server with hexo-image-link installed and uninstalled. It seems like both render the correct image path. Maybe the problem has nothing to do with hexo-image-link

Q3: If I only have hexo-asset-image. I got the image path http://localhost:4000/blog/.io//set-basic-auth.png, whereas the correct path is http://localhost:4000/blog/2022/03/29/web-authentication/set-basic-auth.png. Probably means hexo-asset-image has bugs somewhere.

SukkaW commented 2 years ago

hexo-image-link

FYI. If you are using hexo-renderer-marked, which is the default markdown renderer provided by Hexo, we have already add the support for transforming the relative image path to the absolute URL, see prependRoot at https://github.com/hexojs/hexo-renderer-marked#options. According to the version of hexo-renderer-marked you are using, prependRoot should be enabled by default for you. So you should uninstall both hexo-asset-image and hexo-image-link to see if it works!

Yidi0213 commented 2 years ago

hexo-image-link

FYI. If you are using hexo-renderer-marked, which is the default markdown renderer provided by Hexo, we have already add the support for transforming the relative image path to the absolute URL, see prependRoot at https://github.com/hexojs/hexo-renderer-marked#options. According to the version of hexo-renderer-marked you are using, prependRoot should be enabled by default for you. So you should uninstall both hexo-asset-image and hexo-image-link to see if it works!

Thanks. Yeah, it works after removing hexo-asset-image and hexo-image-link. I don't know if hexo-asset-image is preinstalled. If so, some people in the future might encounter similar problems. It will be helpful to note it in the documentation or not include hexo-asset-image package.

stevenjoezhang commented 2 years ago

hexo-asset-image is not preinstalled. We don't have permission to update its documentation because it's not an official plugin. It's repository is now archived: https://github.com/xcodebuild/hexo-asset-image

yoshinorin commented 2 years ago

@Yidi0213 Thank you for your feedback. May we close this issue?

Yidi0213 commented 2 years ago

Off course! Thanks for the help. I have no idea how i ended up installing hexo-asset-image in the first place lol.

hexojs / hexo