cocoakekeyu / markdown-img-paste

一个可以快速粘贴剪贴板里的照片到markdown的插件,并且可以设置使用七牛存储照片。
MIT License
179 stars 28 forks source link

如何自訂本地端儲存路徑和檔名 #2

Closed ayugioh2003 closed 7 years ago

ayugioh2003 commented 8 years ago

本來想在原始碼看看,但發現沒能力看得懂 不曉得作者未來會不會開放自訂本地端儲存路徑和自訂檔名的功能

cocoakekeyu commented 8 years ago

这个简单,通过插件的查看代码,找到lib/markdown-img-paste.coffee文件。

将36行:fullname = join(dirname(cursor.getPath()), filename) 改为需要保存的路径,如统一保存在当前文件目录下的asset文件夹,可改为 fullname = join(dirname(cursor.getPath()), 'asset', filename)

另外在下面增加两行语句判断并生成不存在的文件夹:

if !fs.existsSync  dirname(fullname)
    fs.mkdirSync  dirname(fullname)

最后保存本地的markdown图片标签输出改下路径变量(filename->fullname):

if !atom.config.get('markdown-img-paste.upload_to_qiniu')
    mdtext = '![](' + fullname + ')'
    paste_mdtext cursor, mdtext

不过这个建议不错,今后升级时将添加一个路径作为设置选项。

ayugioh2003 commented 8 years ago

喔 ~ 感謝你 !!! 沒想到改幾個地方就好了

再請教一個問題,假如我想在 不是該文件目錄底下的資料夾放圖片的話,能怎麼實現這個功能 假設我的目錄結構是這樣

blog
  ├ public
  └ source 
    ├ images
      ├ markdown-img-paste-2016xxxx.png
      └ markdown-img-paste-2017xxxx.png
    └_posts
      ├ a.md
      └ b.md

如果我在 blog/source/_posts/a.md 按下 Ctrl + Shift + T 後,想完成兩件事情

  1. 讓圖片出現在 blog/source/images 裡頭
  2. 在 a.md 的貼上的語法是 ![](images/filename)

這樣能如何實現呢?


我目前的想法是,將這些程式碼

filename = "markdown-img-paste-#{new Date().format()}.png" 
fullname = join(dirname(cursor.getPath()), filename)

if !atom.config.get('markdown-img-paste.upload_to_qiniu')
    mdtext = '![](' + fullname + ')'
    paste_mdtext cursor, mdtext

改成這樣

filename = "markdown-img-paste-#{new Date().format()}.png" 
fullname = join(dirname(cursor.getPath()), filename)

# 在 mdtext 添加 images/ 
if !atom.config.get('markdown-img-paste.upload_to_qiniu')
    mdtext = '![](images/' + filename+ ')'
    paste_mdtext cursor, mdtext

在 md 檔就可以完成想做的事情 (2)

但就不曉得儲存路徑要怎麼改到,該文件的上層目錄的其他資料夾了(如,文件在 blog/source/_post/a.md,圖檔的儲存路徑想從 blog/source/_post 改到 blog/source/images

cocoakekeyu commented 8 years ago

首先,在_post/a.md的文档里面写![](images/markdown-img-paste-2016xxxx.png)并不能引用images/markdown-img-paste-2016xxxx.png的文件。要写成![](../images/markdown-img-paste-2016xxxx.png)

这个需求也很简单,首先构造需要写入文件的全路径: 一个方法是写死指定目录: fullname = join('/home/testname/blog/images', filename) 另一个是获取当前文件路径上一级的路径下的images: fullname = join(dirname(dirname(cursor.getPath())), 'images', filename)

构造出图片全路径后保存之前仍是按照之前的判断路径的文件夹是否存在,并且生成。

在输出markdown text 的地方,需要全路径还是相对路径就自己取舍了。

ayugioh2003 commented 8 years ago

收到 ~ 關於路徑的部份,我選擇採用相對路徑。雖然中途遇到一些錯誤,不過最後成功排除了 回報一下我修改的地方


在第 36 行,用來讀取文件全路徑的程式碼本來是

fullname = join(dirname(cursor.getPath()), filename)

先改成了下面的程式碼,但沒想到卻一直報錯

fullname = join(dirname(dirname(cursor.getPath())), 'images', filename)

後來想想,可能是路徑的問題。在 google 嘗試錯誤後,修改 path.dirname(cursor.getPath())。程式碼如下

fullname = join(dirname(path.dirname(cursor.getPath())), 'images', filename)

圖片就成功的出現在 blog/source/images 了(雖然不太懂原理) 也就是從檔案 a.md 的路徑 blog/source/_posts 先往上一層,再到 blog/source/images

因此我兩個需求都達到了,真的很謝謝你 ~(跪)


補上有修改過的程式碼片段

filename = "#{new Date().format()}.png" # 自己去掉了 "markdown-img-paste-",也就是修改檔名
fullname = join(dirname(path.dirname(cursor.getPath())),'images', filename) # https://goo.gl/Fycf6C 回到上層的 source,再生成圖片到 source/images

# 判断并生成不存在的文件夹
if !fs.existsSync  dirname(fullname)
    fs.mkdirSync  dirname(fullname)

#保存在本地
if !atom.config.get('markdown-img-paste.upload_to_qiniu')
    mdtext = '![](../images/' + filename + ')' # 原本是 '![](' + fullname + ')',修改成 '![](../images/' + filename + ')'
    paste_mdtext cursor, mdtext
cocoakekeyu commented 7 years ago

该功能已增加,close