fix: resolve path of image and embed files, fixed #412

This commit is contained in:
qingwei.li 2018-03-06 11:57:48 +08:00
parent 74ff68a40e
commit bfd0d18e48
8 changed files with 29 additions and 23 deletions

View File

@ -68,7 +68,7 @@ Du kannst untergeordnete Listen erstellen, indem du untergeordnete Punkte einem
wird also wie folgt aussehen
![Nesting navbar](_images/nested-navbar.png 'Nesting navbar')
![Nesting navbar](../_images/nested-navbar.png 'Nesting navbar')
## Angepasste Navigationsleisten in Verbindung mit dem emoji Erweiterung

View File

@ -12,7 +12,7 @@ Du kannst folgende drei Orte verwenden, um die Dokumentation für dein Github re
Es wird empfohlen, deine Dateien im `./docs` Unterordner im `master` branch deines repository zu speichern. Wechsle dann zu den Einstellungen deines repository und wähle `master branch /docs folder` als deine Github Pages Quelle.
![github pages](_images/deploy-github-pages.png)
![github pages](../_images/deploy-github-pages.png)
!> Du kannst die Dateien auch im Hauptverzeichnis speichern und dann `master branch` in den Einstellungen auswählen.

View File

@ -6,14 +6,14 @@ You can embed these files as video, audio, iframes, or code blocks, and even Mar
For example, here embedded a Markdown file. You only need to do this:
```markdown
[filename](_media/example.md ':include')
[filename](../_media/example.md ':include')
```
Then the content of `example.md` will be displayed directly here
[filename](_media/example.md ':include')
[filename](../_media/example.md ':include')
You can check the original content for [example.md](_media/example.md ':ignore').
You can check the original content for [example.md](../_media/example.md ':ignore').
Normally, this will compiled into a link, but in docsify, if you add `:include` it will be embedded.
@ -32,12 +32,12 @@ This is a supported embedding type:
Of course, you can force the specified. For example, you want to Markdown file as code block embedded.
```markdown
[filename](_media/example.md ':include :type=code')
[filename](../_media/example.md ':include :type=code')
```
You will get it
[filename](_media/example.md ':include :type=code')
[filename](../_media/example.md ':include :type=code')
## Tag attribute
@ -56,11 +56,11 @@ Did you see it? You only need to write directly. You can check [MDN](https://dev
Embedding any type of source code file, you can specify the highlighted language or automatically identify.
```markdown
[](_media/example.html ':include :type=code text')
[](../_media/example.html ':include :type=code text')
```
⬇️
[](_media/example.html ':include :type=code text')
[](../_media/example.html ':include :type=code text')
?> How to set highlight? You can see [here](language-highlight.md).

View File

@ -61,4 +61,4 @@ _\_navbar.md_
效果图
![嵌套导航栏](_images/zh-cn/nested-navbar.png '嵌套导航栏')
![嵌套导航栏](../_images/zh-cn/nested-navbar.png '嵌套导航栏')

View File

@ -11,7 +11,7 @@ GitHub Pages 支持从三个地方读取文件
我们推荐直接将文档放在 `docs/` 目录下,在设置页面开启 **GitHub Pages** 功能并选择 `master branch /docs folder` 选项。
![github pages](_images/deploy-github-pages.png)
![github pages](../_images/deploy-github-pages.png)
!> 可以将文档放在根目录下,然后选择 **master 分支** 作为文档目录。

View File

@ -5,14 +5,14 @@ docsify 4.6 开始支持嵌入任何类型的文件到文档里。你可以将
这是一个嵌入 Markdown 文件的例子。
```markdown
[filename](_media/example.md ':include')
[filename](../_media/example.md ':include')
```
`example.md` 文件的内容将会直接显示在这里
[filename](_media/example.md ':include')
[filename](../_media/example.md ':include')
你可以查看 [example.md](_media/example.md ':ignore') 原始内容对比效果。
你可以查看 [example.md](../_media/example.md ':ignore') 原始内容对比效果。
通常情况下,这样的语法将会被当作链接处理。但是在 docsify 里,如果你添加一个 `:include` 选项,它就会被当作文件嵌入。
@ -29,12 +29,12 @@ docsify 4.6 开始支持嵌入任何类型的文件到文档里。你可以将
当然,你也可以强制设置嵌入类型。例如你想将 Markdown 文件当作一个 `code block` 嵌入。
```markdown
[filename](_media/example.md ':include :type=code')
[filename](../_media/example.md ':include :type=code')
```
你将得到
[filename](_media/example.md ':include :type=code')
[filename](../_media/example.md ':include :type=code')
## 标签属性
@ -53,11 +53,11 @@ docsify 4.6 开始支持嵌入任何类型的文件到文档里。你可以将
如果是嵌入一个代码块,你可以设置高亮的语言,或者让它自动识别。这里是手动设置高亮语言
```markdown
[](_media/example.html ':include :type=code text')
[](../_media/example.html ':include :type=code text')
```
⬇️
[](_media/example.html ':include :type=code text')
[](../_media/example.html ':include :type=code text')
?> 如何高亮代码?你可以查看[这份文档](language-highlight.md).

6
package-lock.json generated
View File

@ -2915,7 +2915,8 @@
"jsbn": {
"version": "0.1.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"json-schema": {
"version": "0.2.3",
@ -3333,7 +3334,8 @@
"tweetnacl": {
"version": "0.14.5",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"uid-number": {
"version": "0.0.6",

View File

@ -4,7 +4,7 @@ import {helper as helperTpl, tree as treeTpl} from './tpl'
import {genTree} from './gen-tree'
import {slugify} from './slugify'
import {emojify} from './emojify'
import {isAbsolutePath, getPath} from '../router/util'
import {isAbsolutePath, getPath, getParentPath} from '../router/util'
import {isFn, merge, cached, isPrimitive} from '../util/core'
const cachedLinks = {}
@ -112,7 +112,11 @@ export class Compiler {
if (config.include) {
if (!isAbsolutePath(href)) {
href = getPath(process.env.SSR ? '' : this.contentBase, href)
href = getPath(
process.env.SSR ? '' : this.contentBase,
getParentPath(this.router.getCurrentPath()),
href
)
}
let media
@ -254,7 +258,7 @@ export class Compiler {
}
if (!isAbsolutePath(href)) {
url = getPath(contentBase, href)
url = getPath(contentBase, getParentPath(router.getCurrentPath()), href)
}
return `<img src="${url}"data-origin="${href}" alt="${text}"${attrs}>`