Added configuration for having images resolve to root-relative paths.

If rootRelativeImageURL is false (default), current behaviour remains the same.

If rootRelativeImageURL is true, images with root-relative URLs would be
rendered exactly as specified.
E.g. ![](/assets/image.png) --> <img src="/assets/image.png" />

If rootRelativeImageURL is a string, that would be treated as the path
to which root-relative image paths resolve.
E.g.:
config: { rootRelativeImageURL: "docs" }
![](/assets/image.png) --> <img src="/docs/assets/image.png" />

Author: weijunyu

src/core/config.js

@@ -35,6 +35,7 @@ export default function(vm) {
       crossOriginLinks: [],
       relativePath: false,
       topMargin: 0,
+      rootRelativeImageURL: false,
     },
     typeof window.$docsify === 'function'
       ? window.$docsify(vm)
@@ -79,6 +80,10 @@ export default function(vm) {
     config.name = '';
   }
 
+  if (config.rootRelativeImageURL === true) {
+    config.rootRelativeImageURL = '';
+  }
+
   window.$docsify = config;
 
   return config;

src/core/render/compiler.js

@@ -68,6 +68,7 @@ export class Compiler {
     this.linkRel =
       this.linkTarget === '_blank' ? config.externalLinkRel || 'noopener' : '';
     this.contentBase = router.getBasePath();
+    this.rootRelativeImageURL = config.rootRelativeImageURL;
 
     const renderer = this._initRenderer();
     this.heading = renderer.heading;
@@ -193,7 +194,13 @@ export class Compiler {
 
   _initRenderer() {
     const renderer = new marked.Renderer();
-    const { linkTarget, linkRel, router, contentBase } = this;
+    const {
+      linkTarget,
+      linkRel,
+      router,
+      contentBase,
+      rootRelativeImageURL,
+    } = this;
     const _self = this;
     const origin = {};
 
@@ -237,7 +244,12 @@ export class Compiler {
       compilerClass: _self,
     });
     origin.paragraph = paragraphCompiler({ renderer });
-    origin.image = imageCompiler({ renderer, contentBase, router });
+    origin.image = imageCompiler({
+      renderer,
+      contentBase,
+      router,
+      rootRelativeImageURL,
+    });
     origin.list = taskListCompiler({ renderer });
     origin.listitem = taskListItemCompiler({ renderer });
 

src/core/render/compiler/image.js

@@ -6,7 +6,12 @@ import {
   getParentPath,
 } from '../../router/util';
 
-export const imageCompiler = ({ renderer, contentBase, router }) =>
+export const imageCompiler = ({
+  renderer,
+  contentBase,
+  router,
+  rootRelativeImageURL,
+}) =>
   (renderer.image = (href, title, text) => {
     let url = href;
     let attrs = [];
@@ -40,9 +45,10 @@ export const imageCompiler = ({ renderer, contentBase, router }) =>
     }
 
     if (!isAbsolutePath(href)) {
-      url = isPathRootRelative(href)
-        ? getPath(contentBase, href)
-        : getPath(contentBase, getParentPath(router.getCurrentPath()), href);
+      url =
+        isPathRootRelative(href) && rootRelativeImageURL !== false
+          ? getPath('/' + String(rootRelativeImageURL), href)
+          : getPath(contentBase, getParentPath(router.getCurrentPath()), href);
     }
 
     if (attrs.length > 0) {