gatsby-starter-blog | Gatsby starter for creating a blog | Frontend Framework library
kandi X-RAY | gatsby-starter-blog Summary
kandi X-RAY | gatsby-starter-blog Summary
Gatsby starter for creating a blog
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of gatsby-starter-blog
gatsby-starter-blog Key Features
gatsby-starter-blog Examples and Code Snippets
Community Discussions
Trending Discussions on gatsby-starter-blog
QUESTION
After migrating from Remark to MDX, my builds on Netlify are failing.
I get this error when trying to build:
...ANSWER
Answered 2022-Jan-08 at 07:21The problem is that you have Node 17.2.0. locally but in Netlify's environment, you are running a lower version (by default it's not set as 17.2.0). So the local environment is OK, Netlify environment is KO because of this mismatch of Node versions.
When Netlify deploys your site it installs and builds again your site so you should ensure that both environments work under the same conditions. Otherwise, both node_modules
will differ so your application will have different behavior or eventually won't even build because of dependency errors.
You can easily play with the Node version in multiple ways but I'd recommend using the .nvmrc
file. Just run the following command in the root of your project:
QUESTION
tags and hiding image captions?
I’ve set up my site with the Gatsby starter blog template.
In my Markdown files, I use normal Markdown notation for inserting images with captions. For some reason—I assume it’s because of the gatsby-remark-images
plugin et. al.—my images are automatically wrapped in
tags along with a bunch of other things I don’t understand.
This is the source in Safari:
...ANSWER
Answered 2021-Aug-28 at 08:27Since it's a default configuration and there's no options in the gatsby-remark-images
that to customize the output, you'll need to add a custom component rendering. Luckily, there's a plugin that makes this configuration far easy: gatsby-remark-figure-caption
. Just add it inside the gatsby-transformer-remark
:
QUESTION
I'm a newbie trying to build a Gatsby site that programmatically generates pages for MDX files placed at /content/portfolio
using the following url structure: sitename/portfolio/single-portfolio-item
. The site is running on the gatsby-starter-blog-theme
.
Here are the steps I followed:
Create a new gatsby site:
gatsby new gatsby-portfolio https://github.com/gatsbyjs/gatsby-starter-blog-theme
and start the server withgatsby develop
.Create a directory for portfolio MDX posts:
content/portfolio
create a portfolio post:
content/portfolio/pf1.mdx
with the following content:
ANSWER
Answered 2020-Nov-24 at 06:23Besides the fact that allMdx
is the common way to retrieve .mdx
data. To create a and display it in the front end, just:
QUESTION
I'm building a website with a blog using the Gatsby starter blog on Github. I changed the default styling, pages and some setting, but I kept the same code in the gatsby-node
file that gets all the markdown files which you can then get using graphQL query.
This is how it is supposed to be formatted as HTML. But the screenshot below shows how different the formatting is on the website. The markdown is not properly formatted. When I inspect it using the developer console I can see the proper HTML tags, but it doesn't format
Apparently, I'm doing something wrong, but I can't figure out what.
Source code below:gasty-node.js
:
...ANSWER
Answered 2020-Aug-31 at 16:37Your code is seting correctly the content from the markdown files, there's no mistake there: your dangerouslySetInnerHTML
is working perfectly. You are only missing the styling.
Just add a CSS/SCSS file and add the desired style. In your BlogPostTemplate
component:
QUESTION
... or do I just not find/understand the proper docs? I'm new to Gatsby and many related technologies like React and GraphQL. Two examples referring to the Gatsby Starter Blog
...ANSWER
Answered 2020-Jul-22 at 21:26From the docs it says.
Use to prefix resources URLs.
pathPrefix
will be either empty string or path that starts with slash and doesn't end with slash.
Path prefixing is explained in details here
Regarding globals, yeah, there is a lot of magic happening and documentation is not on the point in that area. But I feel that documentation is pretty good to get you started with the basics. I recommend that you get over node APIs to get the better understanding how you can control the build process.
QUESTION
I am trying to configure my Gatsby project like this starter https://github.com/gatsbyjs/gatsby-starter-blog
In my gatsby-node.js
I have
ANSWER
Answered 2020-Jun-06 at 03:54You are most likely seeing this issue because there are no markdown files found at any of the paths that gatsby-source-filesystem
is pointing to in gatsby-config.js
According to nihgwu's comment on this issue:
the MarkdownRemark node type will only be created when there is a markdown node, or there will be no MarkdownRemark node type at all, so you can't query allMarkdownRemark
To solve your issue, make sure that there is as least one markdown file found in the ${__dirname}/content/blog
folder.
If you do have markdown files in a different folder, make sure to add that location as another gatsby-source-filesystem
entry in your gatsby-config.js
.
QUESTION
I try to generate a Gatsby blog starter using following command:
...ANSWER
Answered 2020-Jun-04 at 03:42Your starter requires sharp
version 0.21.3
(as shown in your error log)
Node 12 support on windows was introduced in version 0.22.1
.
You could try upgrading gatsby-plugin-sharp
and gatsby-transformer-sharp
in your starter, but you might encounter other errors, as the starter hasn't been updated for a while.
QUESTION
I'm using gatsby's blog starter template but want to have full posts in the listing page -- not just an excerpt. On the listing page file (blog.js) I see this is what is pulling the excerpt.
...ANSWER
Answered 2020-Apr-11 at 15:02Assuming that your loop is correct and the data fetching too, if you want to display the full post you need to set it when you use dangerouslySetInnerHTML
with something like this:
QUESTION
I setup a gatsby blog few months ago using the gatsby-starter-blog
and it seems many changes have been made by the contributors of the starter, and I would like to update/upgrade the starter.
I'm now wondering how I can efficiently upgrade it (and its dependencies) without losing my content. I see two options:
Copy the
content/
folder to a new Gatsby starter project, but I will lose my commit history (I'm using branches for WIP posts), and I have to setup again all the plugins I installedManually change the starter core code, which I can do by creating a new blog locally, and copy/paste all the differences I see between the new version and the one I have
Both approaches are not easy, so I'm wondering if there is something simpler I'm missing?
Thanks
...ANSWER
Answered 2020-Jan-20 at 00:36This isn't a typical workflow for starters, so there isn't a great automated approach. This is one of the pain points that Gatsby Themes address, but it sounds like you were using this starter before themes launched.
If you have a separate repo for the up-to-date starter cloned you can do a simple diff between the two folders to get a sense of what's new:
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install gatsby-starter-blog
Create a Gatsby site. Use the Gatsby CLI (install instructions) to create a new site, specifying the blog starter. # create a new Gatsby site using the blog starter gatsby new my-blog-starter https://github.com/gatsbyjs/gatsby-starter-blog
Start developing. Navigate into your new site’s directory and start it up. cd my-blog-starter/ gatsby develop
Open the source code and start editing! Your site is now running at http://localhost:8000! Note: You'll also see a second link: http://localhost:8000/___graphql. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the Gatsby tutorial. Open the my-blog-starter directory in your code editor of choice and edit src/pages/index.js. Save your changes and the browser will update in real time!
Deploy this starter with one click on Gatsby Cloud:.
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page