core icon indicating copy to clipboard operation
core copied to clipboard

[Bug report] VuePress failed to resolve images without `./`

Open Karlatemp opened this issue 3 years ago • 6 comments

Description

VuePress can't resolve images without ./

image


package.json

{
  "devDependencies": {
    "@vuepress/plugin-medium-zoom": "2.0.0-beta.48",
    "@vuepress/plugin-nprogress": "2.0.0-beta.48",
    "@vuepress/plugin-pwa": "2.0.0-beta.48",
    "vuepress": "2.0.0-beta.48"
  },
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
  }
}

.vuepress/config.js

module.exports = {
  "title": "mirai",
  "description": "Mirai Project",
  "markdown": {
    "lineNumbers": true
  },
  "dest": "E:\\IDEAProjects\\project-mirai_docs\\vuepress-dist",
}

Reproduction

null

Used Package Manager

yarn

System Info

System:
    OS: Windows 10 10.0.19044
    CPU: (24) x64 12th Gen Intel(R) Core(TM) i9-12900K
    Memory: 45.02 GB / 95.81 GB
  Binaries:
    Node: 14.17.4 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 8.6.0 - C:\Program Files\nodejs\npm.CMD
  Utilities:
    Git: 2.35.3. - /cmd/git
  Browsers:
    Chrome: 102.0.5005.115
    Edge: Spartan (44.19041.1266.0), Chromium (102.0.1245.41), ChromiumDev (Yes it loads)
  npmPackages:
    @vuepress/bundler-vite:  2.0.0-beta.48
    @vuepress/bundler-webpack: Not Found
    @vuepress/cli:  2.0.0-beta.48
    @vuepress/client:  2.0.0-beta.48
    @vuepress/core:  2.0.0-beta.48
    @vuepress/markdown:  2.0.0-beta.48
    @vuepress/plugin-active-header-links:  2.0.0-beta.48
    @vuepress/plugin-back-to-top:  2.0.0-beta.48
    @vuepress/plugin-container:  2.0.0-beta.48
    @vuepress/plugin-docsearch: Not Found
    @vuepress/plugin-external-link-icon:  2.0.0-beta.48
    @vuepress/plugin-git:  2.0.0-beta.48
    @vuepress/plugin-google-analytics: Not Found
    @vuepress/plugin-medium-zoom: 2.0.0-beta.48 => 2.0.0-beta.48
    @vuepress/plugin-nprogress: 2.0.0-beta.48 => 2.0.0-beta.48
    @vuepress/plugin-palette:  2.0.0-beta.48
    @vuepress/plugin-prismjs:  2.0.0-beta.48
    @vuepress/plugin-pwa: 2.0.0-beta.48 => 2.0.0-beta.48
    @vuepress/plugin-pwa-popup: Not Found
    @vuepress/plugin-register-components: Not Found
    @vuepress/plugin-search: Not Found
    @vuepress/plugin-shiki: Not Found
    @vuepress/plugin-theme-data:  2.0.0-beta.48
    @vuepress/plugin-toc: Not Found
    @vuepress/shared:  2.0.0-beta.48
    @vuepress/theme-default:  2.0.0-beta.48
    @vuepress/utils:  2.0.0-beta.48
    vue:  3.2.37
    vue-loader: Not Found
    vue-router:  4.0.16
    vuepress: 2.0.0-beta.48 => 2.0.0-beta.48
    vuepress-vite:  2.0.0-beta.48
    vuepress-webpack: Not Found

Karlatemp avatar Jun 14 '22 15:06 Karlatemp

Expected. See https://v2.vuepress.vuejs.org/guide/assets.html#relative-urls

Mister-Hope avatar Jun 14 '22 16:06 Mister-Hope

But many md renders support it. I think vp should allow users to use it. Also it wasn't included in Migrating from v1

Karlatemp avatar Jun 14 '22 16:06 Karlatemp

V1 also DO NOT support it.

https://v1.vuepress.vuejs.org/guide/assets.html#relative-urls

So is VitePress https://vitepress.vuejs.org/guide/asset-handling.html#asset-handling

Mister-Hope avatar Jun 14 '22 16:06 Mister-Hope

VitePress implement a custom markdown-it plugin to resolve this issue:

  • https://github.com/vuejs/vitepress/issues/450
  • https://github.com/vuejs/vitepress/pull/514

However, it's not an ideal solution. It made the alias fail to work.

meteorlxy avatar Jun 15 '22 02:06 meteorlxy

I think it does be better to make:

  • ![img](foo/bar.png) be ./foo/bar.png
  • <img src="foo/bar.png" /> be bar.png in package foo

Just like the absolute markdown link.


Markdown syntax can be special handled to align user's intuition when using other markdown tools, and advanced operations can be preserved when using html tags. @meteorlxy

Mister-Hope avatar Jun 15 '22 03:06 Mister-Hope

Or in another word, I think it's do strange for people to use markdown syntax ![img](foo/bar.png) to refrence an alia. Writing <img src"xxx" /> to do that fits people's intuition better.

Just the same as the absolute markdown link, it's quite strange to use an absolute markdown link which should be keeped as is without pending base.

Mister-Hope avatar Jun 15 '22 03:06 Mister-Hope