Upgrade to gatsby-transformer-yaml v4 broke tag page images #115
Comments
|
yeah should probably be renamed, makes sense |
cruelladevil
added a commit
to cruelladevil/tecoble
that referenced
this issue
Oct 31, 2023
cruelladevil
added a commit
to woowacourse/tecoble
that referenced
this issue
Nov 27, 2023
* chore: 패키지 업데이트, nvm 및 volta 설정, script 수정 * chore: yarn.lock 제거 * chore: eslint 및 tsconifg 설정 수정 * chore: gatsby-config 설정 수정 - gatsby-plugin-image 추가 - gatsby-transformer-remark의 옵션중 excerpt_separator 삭제 - gatsby-remark-abbr 삭제 - gatsby-plugin-feed 옵션 추가 * fix: ending slash 제거 - https://github.com/scttcper/gatsby-casper\#how-to-edit-your-site-title-and-description - https://www.gatsbyjs.com/plugins/gatsby-plugin-canonical-urls/ * chore: gatsby-plugin-emotion을 통한 emotion 사용 설정 * feat: gatsby-image를 gatsby-plugin-image로 마이그레이션 * refactor: AuthorYaml의 id 대신 name으로 변경 * refactor: frontmatter___date를 frontmatter: date로 변경 * fix: 404 페이지에서 홈으로 가는 링크 수정 * fix: Pagination 이슈 해결 - issue: scttcper/gatsby-casper#111 - PR: scttcper/gatsby-casper#112 * fix: gatsby-transformer-yaml v4로 업데이트 하면서 id를 사용하지 못하는 이슈 해결 - issue: scttcper/gatsby-casper#115 - PR: scttcper/gatsby-casper#116 * fix: 포스트에서 meta og가 정상적으로 되지 않는 오류 수정 * fix: ico 모듈에 타입을 지정하여 모듈을 찾을 수 없는 타입스크립트 에러 해결 * style: eslint fix - type alias 적용 (consistent-type-definitions: type) - function-declaration 적용 (react/function-component-definition: namedComponents: function-declaration) - import type 적용 (consistent-type-imports: fixStyle: inline-type-imports) - arrow body imemediately return value (arrow-body-style) * style: prettier 적용 * style: 변수명 변경 * fix: eslint 에러 수정 - target이 _blank로 된 form 태그에 noopener와 noreferrer 속성 추가(jsx-no-target-blank) - optional chaining으로 eslint 에러 주석 제거 * style: 코드 스타일 수정 * fix: html lang 속성을 ko로 변경 * feat: about 페이지 삭제 * chore: node 버전을 18.0.0 이상으로 강제(gatsby v5 minimal node version) * chore: gh-pages 패키지 삭제 * feat: mailchimp를 사용하는 subscribe 기능 제거 및 컴포넌트 삭제
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Tags can specify images for their pages. This is demonstrated here:
https://github.com/scttcper/gatsby-casper/blob/master/src/content/tag.yaml
However, if you view the demo you can see that the background image is not displaying:
https://gatsby-casper.netlify.app/tags/speeches/
This is due to
idbeing a reserved internal keyword for Gatsby, so it's translated toyamlId. See here:https://www.gatsbyjs.com/plugins/gatsby-transformer-yaml/#id-and-yamlid-key
This is the breaking change in the plugin for more info:
gatsbyjs/gatsby#28943
It's been broken in this repo since the upgrade to Gatsby v4 in this commit:
910bbd2
Solution to this might be to change all the
idreferences toyamlId. However, I think a better approach might be to use a different name in the yaml instead ofidsuch asnameor something.I think this only affects tags since I believe the only other yaml file is
authors.yamland that doesn't appear to useid, but I haven't investigated deeply.Either way, the references would need to be updated in the code:
https://github.com/scttcper/gatsby-casper/blob/master/src/templates/tags.tsx#L37
https://github.com/scttcper/gatsby-casper/blob/master/src/templates/tags.tsx#L55
and the graphQL query:
https://github.com/scttcper/gatsby-casper/blob/master/src/templates/tags.tsx#L130
The text was updated successfully, but these errors were encountered: