我将 Gatsby 用于我的个人博客。我通过降价文件创建内容,这很有效。我想通过使用降价语法在我的内容中包含图像![My Image](./myImage.png)
。
myImage.png
与文件位于同一文件夹中.md
:
我不知道为什么它不起作用。请问有人给我一个建议吗?
我用这些语法尝试过:
![1](./myImage.png)
![2](./blog/Software/musiker-software/myImage.png)
![3](/blog/Software/musiker-software/myImage.png)
![4](myImage.png)
![5](/myImage.png)
这是我的文件结构
/content
/blog
/category
/blogcontent
article.md
myImage.png
这是我的 gatsby-config.js 文件(顺序相同):
{
resolve: `gatsby-source-filesystem`,
options: {
name: `blog`,
path: `${__dirname}/content/blog`,
},
},
{
resolve: `gatsby-source-filesystem`,
options: {
name: `images`,
path: `${__dirname}/src/images`,
},
},
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [
{
resolve: `gatsby-remark-vscode`,
options: {
theme: {
default: "Dark+ (default dark)",
},
},
},
],
},
},
`gatsby-transformer-sharp`,
`gatsby-plugin-sharp`,
`gatsby-plugin-mdx`,
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [
{
resolve: `gatsby-remark-images`,
options: {
maxWidth: 800,
withWebp: true,
showCaptions: true,
quality: 100,
},
},
],
},
},
{
resolve: "gatsby-transformer-remark",
options: {
plugins: [
{
resolve: "gatsby-remark-embed-video",
options: {
width: 550,
related: true,
noIframeBorder: true,
containerClass: "embedVideo-container"
},
},
],
},
},
这是 HTML 输出:
<img src="./myImage.png" alt="1">
<img src="./blog/Software/musiker-software/myImage.png" alt="2">
<img src="/blog/Software/musiker-software/myImage.png" alt="3">
<img src="myImage.png" alt="4">
<img src="/myImage.png" alt="5">