前言

markdown具有轻量化、易读易写等特性,并且对于图片、超链接、图片、数学公式都有支持。

但是最近在使用Typora的过程中我发现,在写文章笔记的时候导入的图片,因为图片保存在我们电脑本地,当我把文章笔记上传到自己博客就无法显示了。这导致又需要将图片一张一张重新上传,这显然是不合理的。

解决方案

只需要将其图片自动上传到云上,所有的图片链接为网页链接即可解决问题,这时候我们将文章上传到不同的博客图片就不会失效了!

上传到云上的方法:利用PicGo 和 Gitee搭建图床

ps:图床是专门用来存放图片的,同时允许你把图片放到对外连接的网上空间。

所需工具

1、node.js(8.0版本以上)node.js官网

2、PicGo:PicGo官网

3、Typora:Typora官网

4、码云(gitee)账号:码云官网

一、Node.js下载

1.点击上方的官网链接

2.选择下载自己所对应的操作系统

3.下载完成,开始安装

​ 点击安装程序,开始安装node.js

​ 点击【Next】按钮

​ 勾选复选框,点击【Next】按钮

修改文件目录,点击【Next】按钮,接下来都是一路【Next】

​ 安装完成后点击【Finish】按钮完成安装

4.安装完成之后,如果弹出CMD窗口,直接回车即可,这些窗口的出现是因为下载一些配置文件。环境配置(14及以上版本可忽略,因为本身已经path环境变量里设置过了)

5.查看node.js版本号,是否安装成功,输入“ win键 + R” ,打开cmd窗口,通过命令:node -v 查看node版本

npm -v 查看npm版本

出现这个版本信息,则表明node.js安装成功!

二、码云账号

1.码云官网:码云官网

2.注册码云账号

3.注册完成后,然后进入主页面,点击 + 创建新仓库

4.新建仓库 ----》 创建

5.点击“设置 ----》 私人令牌(非常重要,妥善保管)

注意 :点击提交之后,生成的私人令牌需要记入下来,口令只会生成一次。

码云设置成功。

三、PicGo 下载

1.PicGo官网,点击进入官网

2.为什么下载PicGo需要下载node.js

3.点击下载

4.下载完成,安装解压

5.安装插件,安装其一即可

6.设置图床

记得把gitee设置为 默认图床

7.检查图床配置

点击插件配置 ----》点击插件小齿轮 --->配置uploader-gitee

检查是否和我配置的一致

8.检查图片是否上传成功

点击上传区----》上传图片-----》点击相册查看----》存在则成功

点击相册进行查看

可以看到,博主这片文章就是在Typora中编写的,所有的截屏全部上传到gitee进行保存!

9.如果不能在相册区查看到自己的图片

  • 上面的gitee的仓库地址出现错误

四、Typora下载

1.下载安装Typora,Typora官网

2.解压安装,一路【Next】,傻瓜式安装。

3.打开Typora的偏好设置,点击图像,设置如下:

4.设置完成,点击验证图片上传选项

得到结果为下图则表示配置成功

如果你的Typora的偏好设置没有上传服务设置,将Typora升级到最新版本

5.如果你点击验证图片上传选项,不能成功,则有可能为Typora与PicGo端口不一致

Typora端口

PicGo的端口

将PicGo的端口调位36677即可!

6.其他问题

  • 笔者在进行设置完之后,进行测试过,在上图的图像设置中,我们若是在Typora中设置插入图片时···,选择上传图片,则真正上传时,会显示失败:

  • 但是,虽然报错上传失败,我们的图片还是上传成功了的。可以正常使用。

解决办法就是,在选择时,点击无特殊操作,亲测不报错,图片也时正常上传了的。如图:

配置完成后再在Typora写文章笔记,就可以直接导入博客里,再也不会出现图片显示不出来了

参考链接

结束

简单却难发现的小问题

在学习java,配置环境变量时,发现系统变量Path的变量值全部挤在一行

这对于我这个初学者非常困惑,为啥别人电脑都是展开的,而我的环境变量Path却只是显示一行。但是我们设置过的变量都在这里面,比如我们设置过的JAVA_HOME等环境变量,只不过行内显示,这显然不合理,我们很难对path环境变量进行操作。

解决办法

之所以所有设置都显示在一行里,是因为原本系统默认是C:.......开头,而我将%:...开头的变量上移到顶部,所以导致行内显示只显示一行。**所以要将变量回复为文本框,中需要将红框内的部分后移,移到系统自带变量c:....后就可以解决问题啦! **

总结

typora博客笔记上传图片时不能显示的更多相关文章

  1. Typora+PicGo+阿里云写博客笔记

    Typora+PicGo+阿里云写博客笔记 选择这三个工具的理由 我一直有在使用typora使用mardown写作,毕竟typora很香,可以实时预览,非常丝滑. 配合上PicGo这个图床工具简直绝了 ...

  2. Python+Typora博客图片上传

    简介 用Typora 写Markdown 1年多了,这个编辑器的确很好用,但就是写完博客复制到博客园时要一个个手动插替换图片非常麻烦.后来发现最新版的Typora 已经支持图片上传功能,在 设置-图像 ...

  3. 使用github+hexo搭建博客笔记

    听说github上可以搭博客,而且不用自己提供空间和维护,哈哈哈 作为一名程序猿,github搭博客对我有种神奇的吸引力,赶紧动手试一试 关于如何使用hexo搭建博客网上好的教程多如牛毛,而且这篇博客 ...

  4. 转载一个不错的Scrapy学习博客笔记

    背景: 最近在学习网络爬虫Scrapy,官网是 http://scrapy.org 官方描述:Scrapy is a fast high-level screen scraping and web c ...

  5. Hexo搭建博客笔记

    Hexo搭建(建议看ppt:https://files.cnblogs.com/files/-SANG/%E4%BD%A0%E7%9A%84%E7%8C%AB.pptx ) 安装Git https:/ ...

  6. Spring Boot技术栈博客笔记(1)

    要实现的核心功能 用户管理 安全设置 博客管理 评论管理 点赞管理 分类管理 标签管理 首页搜索 核心技术 数据存储 随着spring3发布以来,spring团队减少使用xml配置的使用,采用大量约定 ...

  7. lind.ddd博客笔记索引

    先占位 整理 写博客呢 可以理解为一个动手的过程 写博客呢和实际动手也是一段差距

  8. git 廖雪峰博客笔记

    其他参考 http://www.softwhy.com/article-8498-1.html 本地模拟多用户来学习 参考   其实就是克隆两个目录,两个目录的git config 不同的名字和邮箱, ...

  9. SSM博客 前端页面样式不显示

    <!-- 由于在web.xml中定义的url拦截形式为“/”表示拦截所有的url请求, 包括静态资源例如css.js等.所以需要在springmvc.xml中添加资源映射标 --> < ...

随机推荐

  1. 老鼠走迷宫I

    转自:http://blog.csdn.net/holymaple/article/details/8582517 说明:老鼠走迷宫是递回求解的基本提醒,我们在二维阵列中使用2来表示迷宫墙壁,使用1来 ...

  2. [源码解析] 深度学习流水线并行 GPipe(3) ----重计算

    [源码解析] 深度学习流水线并行 GPipe(3) ----重计算 目录 [源码解析] 深度学习流水线并行 GPipe(3) ----重计算 0x00 摘要 0x01 概述 1.1 前文回顾 1.2 ...

  3. 有关Java动态数组的一个小问题

    前言 问题描述 今天遇到一个关于集合的问题,觉得比较有趣,记录一下,这个问题是:定义一个用户类,至少包含姓名,年龄,生日,qq邮箱,初始化10个用户,利用String操作,提取qq到List集合中,姓 ...

  4. 「萌新指南」SOA vs. 微服务:What’s the Difference?

    实话实说,在我还没有实习之前,我是连 SOA 是啥都不知道的,只听说过微服务,毕竟微服务实在太火了,想不知道都难,我觉得实习的时候肯定也是微服务,进组之后发现是 SOA 架构,当时都懵了,看了很多文档 ...

  5. 修改Windows7系统默认软件安装目录

    Windows7系统默认软件安装目录都在C盘Program Files文件夹有时候我们需要把软件安装到其他地方,如果每次安装的时候都要重新选择一次十分麻烦,下面Windows7之家教你修改软件默认安装 ...

  6. shell中的引号

    单引号: 所见即所得 原封不动输出 双引号: 与单引号类似 特殊符号进行解析 ( $ $() `` ! ) 无引号: 与双引号类似 支持通配符( {} * ) 反引号: 优先执行 优先执行里面的命令, ...

  7. C# ASP.NET RAZOR 链接SQLSERVER

    @using System.Data.SqlClient; @using System.Data;//必须引用 <html> <body> <h1>Learn Sq ...

  8. Robot Framework(6)- BuiltIn 测试库常用的关键字列表

    如果你还想从头学起Robot Framework,可以看看这个系列的文章哦! https://www.cnblogs.com/poloyy/category/1770899.html 前言 所有关键字 ...

  9. pythonGUI-PySide2的使用笔记

    用python开发跨平台的图形化界面,主流的有3种选择: Tkinter 基于Tk的Python库,Python官方标准库,稳定.发布程序较小,缺点是控件相对较少. wxPython 基于wxWidg ...

  10. 图论---最小生成树----普利姆(Prim)算法

    普利姆(Prim)算法 1. 最小生成树(又名:最小权重生成树) 概念:将给出的所有点连接起来(即从一个点可到任意一个点),且连接路径之和最小的图叫最小生成树.最小生成树属于一种树形结构(树形结构是一 ...