English Readme / 简体中文说明 / 繁體中文說明
Markdown Image
An extension for conveniently inserting pictures in Markdown, which supports storing pictures in local or third-party CDN service.
❤ Sponsor me / 赞助开发者
Features
- Copy image files or paste screenshots, Shortcut key
Alt + Shift + V
, or right-click menu Paste Image
.
- Automatically generate Markdown code insertion.
- Configurable to support
Imgur
, Qiniu
, SM.MS
, Cloudflare
, Cloudinary
, S3
, Azure Storage
and other CDN service. The default is local, you need to open the folder where the Markdown file is located.
- You can also customize the code to upload pictures.
- Support Windows, MacOS, Linux.
Requirements
Linux users must install xclip.
Ubuntu
sudo apt install xclip
CentOS
sudo yum install epel-release.noarch
sudo yum install xclip
Notice
If you want to use in the Remote Mode, please set remote.extensionKind
like this:
"remote.extensionKind": {
"hancel.markdown-image": [
"ui"
]
}
And if you want to save image in your remote workplace, you must use SFTP
upload method. Local
couldn't use in Remote Mode.
Extension Settings
Base Settings
markdown-image.base.uploadMethod
: Method to upload pictures. To the local or another picture CDN service.
markdown-image.base.fileNameFormat
: The filename format for upload. Not Support in Imgur
and SM.MS
. You can use some variables. You can find more in setting.
markdown-image.base.codeType
: The type of image code, you can set to <img>
tag or markdown
markdown-image.base.imageWidth
: The maximum width of the image, if the image is greater than this width, the width is set to this value. Set to 0 means not change.
markdown-image.base.urlEncode
: Whether URL encode for the url of image.
Local Settings
markdown-image.local.path
: Picture storage directory that in the local (automatically created if it does not exist).
markdown-image.local.referencePath
: The reference path format in markdown(not include file name). Empty means use relative path. You can use variable of #markdown-image.base.fileNameFormat#
in here. For example: /images/${YY}-${MM}/
GitHub Settings
markdown-image.github.path
: Picture upload directory that in the repository (automatically created if it does not exist). The repository must initialization first.
markdown-image.github.token
: GitHub person access token.
markdown-image.github.repository
: GitHub repository, for example: https://github.com/username/repository
markdown-image.github.branch
: GitHub repository branch to save.
markdown-image.github.cdn
: The github cdn address format to be used, ${username}
is the username of markdown-image.github.repository
, and ${repository}
is the repository name. ${branch}
is the value of markdown-image.github.branch
. ${filepath}
is the upload path in repository.
markdown-image.github.httpProxy
: Connect to Github via http proxy.
Imgur Settings
markdown-image.imgur.clientId
: The client id registered with imgur. You can registed it at here.
markdown-image.imgur.httpProxy
: Connect to Imgur via http proxy.
SM.MS Settings
markdown-image.sm_ms.token
: SM.MS API token (Options). You can register an account and then visit API Token Page to generate secret token.
Qiniu Settings
markdown-image.qiniu.accessKey
: The Access Key of account.
markdown-image.qiniu.secretKey
: The Secret Key of account.
markdown-image.qiniu.bucket
: The storage name.
markdown-image.qiniu.domain
: Bound domain name of storage.
markdown-image.qiniu.zone
: Zone of storage.
Upyun Settings
markdown-image.upyun.bucket
: Storge name of upload.
markdown-image.upyun.domain
: Domain bind with storge name.
markdown-image.upyun.operator
: Operator of upyun.
markdown-image.upyun.password
: Password of upyun operator.
markdown-image.upyun.path
: The path that img store.
markdown-image.upyun.link
: The link that connect to upyun.
Cloudinary Settings
These values can be found on your Cloudinary Dashboard
markdown-image.cloudinary.cloudName
: Your user account name.
markdown-image.cloudinary.apiKey
: API key for your account.
markdown-image.cloudinary.apiSecret
: API secret for your account.
markdown-image.cloudinary.folder
: Folder to upload the image to.
Cloudflare Settings
These values can be found on your Cloudflare dashboard
markdown-image.cloudflare.accountId
: Your account ID.
markdown-image.cloudflare.apiToken
: Cloudflare Images API token.
S3 Settings
These values can be found in your S3 service provider dashboard
markdown-image.s3.endpoint
: The endpoint for S3 API, can be obtained from bucket setting.
markdown-image.s3.region
: The region for the S3 bucket, can be obtained from bucket setting.
markdown-image.s3.bucketName
: The name of the S3 bucket to upload images to. Access to the bucket should be public.
markdown-image.s3.accessKeyId
: Your S3 API access key ID.
markdown-image.s3.secretAccessKey
: Your S3 secret access key.
markdown-image.s3.cdn
: Your S3 CDN Url. You can use variable ${bucket}
${region}
${pathname}
and ${filepath}
. For example: https://${bucket}.${region}.s3.amazonaws.com/${pathname}/${filepath}
.
SFTP Settings
markdown-image.sftp.host
: The host of the remote server.
markdown-image.sftp.port
: The ssh port of the remote server.
markdown-image.sftp.username
: The username of the remote server.
markdown-image.sftp.password
: The password of the remote server.
markdown-image.sftp.privateKeyPath
: The private key path of the remote server.
markdown-image.sftp.path
: Picture storage directory that in the remote (automatically created if it does not exist). Notice: You can't use variable in here. You can use variable in #markdown-image.base.fileNameFormat#
.
markdown-image.sftp.referencePath
: The reference path format in markdown(not include file name). Empty means use relative path. You can use variable of #markdown-image.base.fileNameFormat#
in here. For example: /images/${YY}-${MM}/
Azure Storage Settings
markdown-image.azure.authenticationMethod
: The authentication method to use for the Azure Blob Storage account. The default is Passwordless
. You can obtain more information from here.
markdown-image.azure.accountName
: Your Azure Blob Storage account.
markdown-image.azure.connectionString
: The connection string of the Azure Storage account.
markdown-image.azure.container
: The name of the container to upload images to.
DIY Settings
markdown-image.DIY.path
: The Code Path what you write. Your code must exports a function as async function (filePath:string, savePath:string, markdownPath:string):string
.
For example:
const path = require("path");
module.exports = async function (filePath, savePath, markdownPath) {
// Return a picture access link
return path.relative(path.dirname(markdownPath), filePath);
};
Release Notes
1.1.43
- Fixed the issue where the
path
variable still had incomplete backslashes replaced.
1.1.42
- Fixed the issue where the
path
variable is not in Unix format when running at Microsoft Windows.
1.1.41
- Added a new setting item
markdown-image.s3.config
to config s3 client.
- Fixed the s3 cdn url generate wrong.
1.1.40
- Added a new setting item
markdown-image.s3.cdn
to set the s3 cdn url.
1.1.39
- Add
Content-Type
to s3 upload method.
1.1.38
- Supports Azure Blob Storage Passwordless authentication method.
1.1.37
- Add support for Azure Storage.
1.1.36
- Fixed the issue where the placeholder
filename
was not using the value calculated by fileNameFormat
.
1.1.35
- Fixed the issue where only the first occurrence of the same variable for
fileNameFormat
was effective.
1.1.34
- Added a new setting item
markdown-image.base.altFormat
to set the placeholder for image code.
1.1.33
- Added a new setting item
markdown-image.base.uploadMethods
to support concurrent uploads with multiple upload methods.
- Added a new setting item
markdown-image.base.fileFormat
to set the file format for saving clipboard images.
- Removed the deprecated Coding image hosting service.
- Supported pasting images into unconventional editing windows.
1.1.30
- Added new setting
markdown-image.github.httpProxy
to settting GitHub http proxy.
1.1.29
- Fix failed to get image from clipboard on deepin.
1.1.28
- Support group setting.
- Add support for remote mode.
- Add SFTP upload method.
- Includes the following new settings:
markdown-image.sftp.host
markdown-image.sftp.port
markdown-image.sftp.username
markdown-image.sftp.password
markdown-image.sftp.privateKeyPath
markdown-image.sftp.path
markdown-image.sftp.referencePath
1.1.27
- Add support for S3 compatible providers.
- Includes the following new settings:
markdown-image.s3.endpoint
markdown-image.s3.region
markdown-image.s3.bucketName
markdown-image.s3.accessKeyId
markdown-image.s3.secretAccessKey
1.1.26
- Add support for Upyun.
- Includes the following new settings:
markdown-image.upyun.bucket
markdown-image.upyun.domain
markdown-image.upyun.operator
markdown-image.upyun.password
markdown-image.upyun.path
markdown-image.upyun.link
1.1.25
- Fixed image url of GitHub CDN encode wrong when enable
markdown-image.base.urlEncode
.
1.1.24
- Fixed some bug of the option
markdown-image.local.referencePath
.
- Fixed the
alt
count of image restart when restarted extension.
1.1.23
- Added new setting
markdown-image.github.cdn
to settting GitHub CDN Format Address.
1.1.22
- Fix upload wrong path in GitHub Mode.
1.1.21
- Fix the problem of uploading to GitHub when the file path contains Chinese.
1.1.20
- Fixed bug of the setting start with
/
on local.referencePath
.
1.1.19
- Fixed local mode always save to disk root path.
1.1.18
- Fixed local mode can't use absolute path.
1.1.17
- Add support for Cloudflare Images.
- Includes the following new settings:
markdown-image.cloudflare.accountId
markdown-image.cloudflare.apiToken
1.1.16
- Add to support upload image to github repository.
1.1.15
- Add file format variable
prompt
. Makes it possible to enter a custom name through an input prompt when pasting the image.
1.1.14
- Update Coding Picbed Package to fixed upload to coding error.
1.1.13
- Added new setting
markdown-image.local.referencePath
to support DIY reference path in markdown file.
1.1.12
- Added to support paste image in Jupyter file.
1.1.11
- Updated Cloudinary CDN to use the
markdown-image.base.fileNameFormat
setting. The extension will check for existing files and will prompt to overwrite if necessary.
1.1.10
- Added support for Cloudinary CDN
- Includes the following new settings:
markdown-image.cloudinary.cloudName
markdown-image.cloudinary.apiKey
markdown-image.cloudinary.apiSecret
markdown-image.cloudinary.folder
1.1.9
- Added setting options
markdown-image.base.codeType
and markdown-image.base.imageWidth
use to set the maximum image width.
1.1.8
- Fixed vscode caches the
DIY
path code, causing a question that cannot be changed immediately.
1.1.7
- Added a option to switch whether url encode.
1.1.6
- Fixed extension log level.
- Update action after replace file.
1.1.5
- Fixed
Data URL
Setting Description.
1.1.4
- Added upload method
Data URL
.
- Fixed paste multiple documents invalid.
1.1.3
- Fixed the filename format variable
${path}
were uploaded to the Coding
failure in the Windows.
1.1.2
- Fixed the path contains Chinese prompts cannot be found when pasting the copied picture again. 😂
1.1.1
- Fixed the path contains Chinese prompts cannot be found when pasting the copied picture.
1.1.0
- Added Beta feature, support paste rich text. (Only supports Windows)
1.0.14
- Fixed incompatibility with Windows 7.
1.0.13
- Fixed getting the path resolution error of the clipboard picture in Windows.
1.0.12
- Added file name variable
${path}
: "The path of the Markdown file being edited relative to the root directory."
1.0.11
- Fix api url of
sm.ms
.
- Fixed the file name with spaces cannot be found in Linux.
- Added prompt without token in
sm.ms
.
1.0.10
- Fix the variable
$mdname
does not remove the extension name of md
.
1.0.9
- Fixed the problem of getting wrong date and hour in filename formatting.
1.0.8
1.0.7
- Fixed launch extension home page failed at MacOS and Linux.
- Fixed the colon of the picture address is incorrectly encode.
1.0.6
- Fixed the date variable has not consider the time zone.
1.0.5
- Fixed file name include space could not preview.
- Fixed random variable not work.
1.0.4
1.0.3
1.0.2
- Fixed replace notice bug.
1.0.1
1.0.0
Others
Enjoy!