Gatsby 盖茨比降价备注图片未显示
我在用盖茨比写我的个人博客。我通过标记文件创建内容,这很有效 . 我想在我的内容中使用标记语法Gatsby 盖茨比降价备注图片未显示,gatsby,gatsby-image,gatsby-remark-image,Gatsby,Gatsby Image,Gatsby Remark Image,我在用盖茨比写我的个人博客。我通过标记文件创建内容,这很有效 . 我想在我的内容中使用标记语法![我的图像](./myImage.png) myImage.png与.md文件位于同一文件夹中: 我不知道它为什么不起作用。有人能给我一个建议吗? 我试着用这些语法: ![1](./myImage.png) ![2](./blog/Software/musiker-software/myImage.png) ![3](/blog/Software/musiker-software/myImage.pn
![我的图像](./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文件(顺序相同):
{
解析:`gatsby源文件系统`,
选项:{
名称:`blog`,
路径:`${uu dirname}/content/blog`,
},
},
{
解析:`gatsby源文件系统`,
选项:{
名称:`images`,
路径:`${uu dirname}/src/images`,
},
},
{
决议:`盖茨比变压器备注',
选项:{
插件:[
{
解析:`gatsby remark vscode`,
选项:{
主题:{
默认值:“暗+(默认暗)”,
},
},
},
],
},
},
`盖茨比变压器,
`盖茨比,
`盖茨比插件mdx`,
{
决议:`盖茨比变压器备注',
选项:{
插件:[
{
决议:`盖茨比评论图像',
选项:{
最大宽度:800,
withWebp:没错,
字幕:对,
质量:100,
},
},
],
},
},
{
决议:“盖茨比变压器评论”,
选项:{
插件:[
{
解析:“盖茨比评论嵌入视频”,
选项:{
宽度:550,
相关:是的,
对,没错,
containerClass:“嵌入视频容器”
},
},
],
},
},
这是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">
好的,我知道了:
这是因为gatsby transformer remark
被声明了两次,因此较低的声明覆盖了较高的声明。我合并了这两个,所以现在它工作了:
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [
{
resolve: `gatsby-remark-images`,
options: {
maxWidth: 1200,
},
},
{
resolve: `gatsby-remark-vscode`,
options: {
theme: {
default: "Dark+ (default dark)",
},
},
},
{
resolve: "gatsby-remark-embed-video",
options: {
width: 550,
related: true,
noIframeBorder: true,
containerClass: "embedVideo-container"
},
},
],
},
},
`gatsby-transformer-sharp`,
`gatsby-plugin-sharp`,
`gatsby-plugin-mdx`,
我不得不移除:
gatsby头盔
当我做这个项目时,这是在我的gatsby-config.js中
System:
OS: Linux 4.9 Debian GNU/Linux 9 (stretch) 9 (stretch)
CPU: (8) x64 Intel(R) Core(TM) i5-8250U CPU @ 1.60GHz
Shell: 4.4.12 - /bin/bash
Binaries:
Node: 12.19.0 - /usr/bin/node
npm: 6.14.8 - /usr/bin/npm
Languages:
Python: 2.7.13 - /usr/bin/python
npmPackages:
gatsby: ^2.31.1 => 2.32.0
gatsby-image: ^2.5.0 => 2.11.0
gatsby-plugin-manifest: ^2.6.1 => 2.12.0
gatsby-plugin-offline: ^3.4.0 => 3.10.0
gatsby-plugin-react-helmet: ^3.4.0 => 3.10.0
gatsby-plugin-sharp: ^2.14.0 => 2.14.0
gatsby-plugin-sitemap: ^2.11.0 => 2.12.0
gatsby-remark-images: ^3.11.0 => 3.11.0
gatsby-source-filesystem: ^2.10.0 => 2.11.0
gatsby-transformer-remark: ^2.16.0 => 2.16.0
gatsby-transformer-sharp: ^2.6.0 => 2.12.0
npmGlobalPackages:
gatsby-cli: 2.18.0