关于Markdown插入图片路径错误的问题

开发问题 解决方法 

妈耶,连续一天写2篇博客,也是醉了,这篇博客主要是介绍关于Markdown插入图片路径错误的问题

在上篇中,我介绍了一下Markdown的基本语法,并且提到了图片插入的方式.不过有一个问题,就是当在vscode插入图片能够完美预览,但是当在本地服务器和Github上运行,图片就无法显示.

就像这样,图片无法显示


这时候查看网页源代码发现是这样的


查看文件目录


如果这之后将网址输入为

http://localhost:4000/2018/09/07/Markdown%E5%9F%BA%E6%9C%AC%E8%AF%AD%E6%B3%95/02.jpg

发现能够完美显示,那表示图片没问题,是路径的问题.在官方的参考资料中,使用了

{% asset_img example.jpg This is an example image %}

来引用图片. 不过个人觉得这样不是很好,首先它不是标准的markdown语法,其次无法实时预览.百度了很久,终于在一篇大佬的博客上找到了解决方法.

First Step

在 [你的hexo安装地址]\node_modules\hexo-asset-image 找到 index.js打开进行编辑

var beginPos = getPosition(link, '/', 3) + 1;
改成
var beginPos = getPosition(link, '/', 1) + 1;

这时候执行

hexo clean
hexo g
hexo s

就能能够完美的显示图片了

早点睡觉了,不修仙

关于Markdown插入图片路径错误的问题的更多相关文章

  1. MarkDown插入图片

    MarkDown插入图片的语法 ·编辑器:MacDown 比如博客园的Logo,URL是 http://static.cnblogs.com/images/logo_small.gif 在要插入图片的 ...

  2. webpack学习笔记——打包后直接访问页面,图片路径错误

    我说的这种图片路径错误是这样的,运行webpack-dev-server,一切正常,没有错误.当webpack之后,直接打开index页面,报错,图片找不到,找不到的原因是路径错误. 先看我的项目代码 ...

  3. 【Tips】有道云笔记中Markdown插入图片

    在有道云笔记中用MarkDown插入图片 新建一个文档专门用来放图片 把所有要用的图片专门放在一个笔记里,用普通模式先同步笔记,然后用分享笔记 会有一个链接,用浏览器打开这个分享的笔记就能找到所有的图 ...

  4. 优雅地在markdown插入图片

    markdown 中插入图片,好烦!!!   喜欢用Markdown写文字,但是它的图片引用是一个大问题(当然csdn不会遇到这个问题).借用第三方将图片储存在印象笔记上是一个好办法.但是会出现的一个 ...

  5. Markdown 插入图片技巧

    在使用Markdown编写博客或文件的时候,经常会需要插入图片.如果使用Markdown语法,我们会发现调整图片的大小会是个问题. 所以推荐使用另一种办法插入图片,使用HTML语法,示例如下: < ...

  6. Vue项目开发之打包后背景图片路径错误的坑

    在开发vue项目的过程中,使用浏览器进行预览的时候所有图片的路径是没有任何问题的,但是在打包后传到服务器上,在微信端查看背景图片时,background的图片竟然不显示,img标签里的图片却是正常展示 ...

  7. 解决Vue打包后背景图片路径错误问题

    1.原因解析 当用vue-cli自动构建项目后,有两种运行方法,分别是: npm run dev : 提供一个开发的环境,自动热更新,资源使用绝对路径,所以可以正常看到背景图片. npm run bu ...

  8. markdown 插入图片太大?怎么设定图片大小?

    你一定在插入图片的时候,遇到图片太大,影响观感的问题. Markdown中,图片大小的设定方式有两种 第一种: ![](https://img2018.cnblogs.com/blog/1735896 ...

  9. 有道云笔记MarkDown 插入图片

    前言: 在网上找了很多有道云笔记的markdown笔记如何插入本地图片,试了好几种方式都是一时可以显示而已,只要电脑重启或者换终端查看就无法显示图片了.网上常用的方法无非两种有效:github.博客. ...

随机推荐

  1. Windows 95 输入法编辑器

    Windows 95 输入法编辑器 翻译:戴石麟译自微软的MSDN DDK 关于Windows 95的多语言IME(输入法编辑器) 在Windows 95中,IME以动态连接库(DLL)的形式提供,与 ...

  2. Mahout简介

    Mahout简介 一.mahout是什么 Apache Mahout是ApacheSoftware Foundation (ASF)旗下的一个开源项目,提供了一些经典的机器学习的算法,皆在帮助开发人员 ...

  3. Scala_关键字

    关键字 Lazy Scala中用lazy定义的变量叫惰性变量,会实现延迟加载:惰性变量只能是不可变变量,而且只有在调用惰性变量时,才会去实列化这个变量 object ScalaLazyDemo1{   ...

  4. SQLite中sqlite3_column_value()的返回值

    sqlite3_column_value()的返回对象是一个 unprotected sqlite3_value 对象.一个不受保护的sqlite3_value object可能只能用于 sqlite ...

  5. python- 动态加载目录下所有的类

    # 背景 自动化测试框架中model层下有很多类,用来操作mysql的,使用的时候需要把全部的类加载进来,需要使用到动态加载类 # 解决方法 使用pkgutil,内置的方法,常用的话有两个方法 ite ...

  6. JS中同步显示并分割输入的数字字符串

    题目比较晦涩,来张图来说明要表达的效果: 第一张图的效果就是,用户输入一个数字,上面就显示一个大层,然后显示输入的数字,并把数字用空格按照每四位分割出来.好像在建行的网上银行上面就有这种效果.第二个图 ...

  7. 日期时间类:Date,Calendar,计算类:Math

    日期时间类 计算机如何表示时间? 时间戳(timestamp):距离特定时间的时间间隔. 计算机时间戳是指距离历元(1970-01-01 00:00:00:000)的时间间隔(ms). 计算机中时间2 ...

  8. 【文文殿下】P3737 [HAOI2014]遥感监测

    题解 显然可以把每个观测点,认为是x轴上的一段区间.问题就转换为了:对于x轴上的若干个区间,选取尽可能少的点,使得所有区间都有至少一个点. 这是一个相当经典的贪心问题. 代码如下: #include& ...

  9. C语言通过匿名管道实现反弹式CMDShell

    #pragma comment(lib,"ws2_32.lib") #ifdef _MSC_VER #pragma comment( linker, "/subsyste ...

  10. MySQL 主从复制相关参数

    列举了MySQL主从复制主要的相关参数 binlog server_id 服务器在集群中唯一标识符 log_bin[=binlog_name] 启动二进制日志 log_bin_index 二进制日志索 ...