GithubHelp home page GithubHelp logo

tryghost / gatsby-starter-ghost Goto Github PK

View Code? Open in Web Editor NEW
1.0K 23.0 873.0 17.51 MB

A starter template to build lightning fast websites with Ghost & Gatsby

Home Page: https://gatsby.ghost.org

License: MIT License

JavaScript 82.06% CSS 17.94%
gatsby gatsby-starter netlify ghost static-site static-site-generator gatsbyjs react

gatsby-starter-ghost's Introduction

Gatsby Starter Ghost

A starter template to build lightning fast websites with Ghost & Gatsby

Demo: https://gatsby.ghost.org/

 

gatsby-starter-ghost

 

Installing

# With Gatsby CLI
gatsby new gatsby-starter-ghost https://github.com/TryGhost/gatsby-starter-ghost.git
# From Source
git clone https://github.com/TryGhost/gatsby-starter-ghost.git
cd gatsby-starter-ghost

Then install dependencies

yarn

 

Running

Start the development server. You now have a Gatsby site pulling content from headless Ghost.

gatsby develop

By default, the starter will populate content from a default Ghost install located at https://gatsby.ghost.io.

To use your own install, you will need to edit the .ghost.json config file with your credentials. Change the apiUrl value to the URL of your Ghost site. For Ghost(Pro) customers, this is the Ghost URL ending in .ghost.io, and for people using the self-hosted version of Ghost, it's the same URL used to access your site.

Next, update the contentApiKey value to a key associated with the Ghost site. A key can be provided by creating an integration within Ghost Admin. Navigate to Integrations and click "Add new integration". Name the integration appropriately and click create.

Finally, configure your desired URL in siteConfig.js, so links (e. g. canonical links) are generated correctly. You can also update other default values, such as postsPerPage in this file.

To use this starter without issues, your Ghost installation needs to be at least on version 2.10.0.

The default Ghost version that is used for this starter is 5.x. If your Ghost installation is on a lower version, you will need to pass in a version property in your .ghost.json settings:

Ghost >=2.10.0 <5.0.0

{
    "apiUrl": "https://gatsby.ghost.io",
    "contentApiKey": "9cc5c67c358edfdd81455149d0",
    "version": "v4.0"
}

Ghost >=5.0.0

{
    "apiUrl": "https://gatsby.ghost.io",
    "contentApiKey": "9cc5c67c358edfdd81455149d0"
}

 

Deploying with Netlify

The starter contains three config files specifically for deploying with Netlify. A netlify.toml file for build settings, a /static/_headers file with default security headers set for all routes, and /static/_redirects to set Netlify custom domain redirects.

To deploy to your Netlify account, hit the button below.

Deploy to Netlify

Content API Keys are generally not considered to be sensitive information, they exist so that they can be changed in the event of abuse; so most people commit it directly to their .ghost.json config file. If you prefer to keep this information out of your repository you can remove this config and set Netlify ENV variables for production builds instead.

Once deployed, you can set up a Ghost + Netlify Integration to use deploy hooks from Ghost to trigger Netlify rebuilds. That way, any time data changes in Ghost, your site will rebuild on Netlify.

 

Optimising

You can disable the default Ghost Handlebars Theme front-end by enabling the Make this site private flag within your Ghost settings. This enables password protection in front of the Ghost install and sets <meta name="robots" content="noindex" /> so your Gatsby front-end becomes the source of truth for SEO.

 

Extra options

# Run a production build, locally
gatsby build

# Serve a production build, locally
gatsby serve

Gatsby develop uses the development config in .ghost.json - while Gatsby build uses the production config.

 

Copyright & License

Copyright (c) 2013-2023 Ghost Foundation - Released under the MIT license.

gatsby-starter-ghost's People

Contributors

aileen avatar allouis avatar daniellockyer avatar daviddarnes avatar erisds avatar fedetibaldo avatar giggiux avatar johnonolan avatar kerumen avatar kevinansfield avatar mschmo avatar mskian avatar mtlynch avatar naz avatar omarkhairy21 avatar paulmelnikow avatar peterzimon avatar renovate-bot avatar renovate[bot] avatar rishabhgrg avatar rmatambo8 avatar ryoheitomiyama avatar shrmnk avatar styxlab avatar tanvibhakta avatar toddbirchard avatar vikaspotluri123 avatar yoranbrondsema avatar zce avatar ziondials avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

gatsby-starter-ghost's Issues

Starter development roadmap

Hi Team - still very new to JAMstack, so understanding of development and integrations is quite basic.

Got your starter template working, but was expecting something closer to the user experience of the actual Casper theme.

Is there plans to develop his starter?

For example, I came across this project, and it seems to be a bit more in-line with the feel of the full casper theme (though it doesn't integrate with ghost - yet (?)). demo here

TypeError: Parameter 'url' must be a string, not object

Found this Error after updating the WebsiteMeta.js

WebpackError: TypeError: Parameter "url" must be a string, not object
  
  
  
  
  - static-entry.js:32 Object.urlResolve [as resolve]
    lib/.cache/static-entry.js:32:3
  
  - WebsiteMeta.js:15 WebsiteMeta
    lib/src/components/common/meta/WebsiteMeta.js:15:28
  
  - bootstrap:22 c
    lib/webpack/bootstrap:22:1
  
  - bootstrap:25 Sa
    lib/webpack/bootstrap:25:1
  
  - bootstrap:30 a.render
    lib/webpack/bootstrap:30:1
  
  - bootstrap:30 a.read
    lib/webpack/bootstrap:30:1
  
  - bootstrap:42 renderToString
    lib/webpack/bootstrap:42:1
  
  - static-entry.js:194 Module../.cache/static-entry.js.__webpack_exports__.default
    lib/.cache/static-entry.js:194:18
  
  - bootstrap:24 Promise
    lib/webpack/bootstrap:24:1
  
  
  - gatsby-browser-entry.js:1 Promise._resolveFromExecutor
    lib/.cache/gatsby-browser-entry.js:1:1
  
  - bootstrap:68 new Promise
    lib/webpack/bootstrap:68:1

Add icon, ghost_head, and ghost_foot to data-stub file

Because the publication icon and the code injections are not populated by default for new Ghost instances, they are populated as null from the gatsby-source-ghost plugin. Using these properties then in GraphQL queries causes the build to break.

This is a known issue with GraphQL and being tracked for this repository here: TryGhost/gatsby-source-ghost#2

Due to this issue we created a data-stub file which needs to be imported before you connect the starter with your own Ghost installation.

This data-stub file needs to be amended to insert an icon (preferably favicon.png), as well as some dummy site codeinjection content.

Whereas this change is pretty easy to do, it needs to be discussed and thought through, what data we want to inject and how to prevent overwriting existing one.

Once, the data-stub file is extended, we need to include those three properties in the fragments file.

Missing image referenced in siteConfig.js

A minor issue. In:

shareImage: `/images/Ghost-Docs.jpg`, // fallback image for meta data. Will be used, when no post/tag/author image specified. 1200x1200 is recommended

The corresponding image doesn't exist in:

https://github.com/TryGhost/gatsby-starter-ghost/blob/master/src/images

The effect will be 404 on site share of the demo on social media. I do find having all the files there useful to know what I need to create to customise though. Happy to fix & PR if you supply the image.

Global site/config values

Problem description

Throughout the codebase we're using values that either come from the starter specific siteConfig.js, or - via Content API - the Ghost settings (like here for example, where we run a StaticQuery in order to use both sources).

Ideally those would be merged together in one site or config, so it's easily accessible by other components/modules.

The biggest pain point here is, that we need the values from the Ghost settings already in the gatsby-config.js! Because of the unavailability of the Ghost settings in this file, we had to create a workaround and adjust the gatsby-offline-manifest plugin (👉 see PR here #15)

This is due to Gatsby's specific lifecycle that allows to run GraphQL queries only after the first schema creation. This means at the point when Gatsby is processing the config file, it simply doesn't know about Ghost settings yet.

Proposal

Create a script, that runs before any Gatsby activities and fetches the data from the settings endpoint via Content API (without gatsby-source-ghost usage) and make those merged values available in gatsby-config (and ofc any other occurrences). This can be a .json file for example that get's replaced with every build.

Todos

  • Finalise idea for this solution. Maybe there are better ways of doing that, then the proposed way?
  • Implement solution
  • Replace all StaticQuery occurrences for allGhostSettings and use new solution
  • Revert #15 and use default again

serve in /blog

Hello,

I'm trying to build a personal blog with this starter. I'm running into issues. I want this starter homepage to be served in /blog and build my own homepage. I tried it with changing the node slugs with /blog/ in front of it. It worked but now running into a lot of issues with this hacky method (linking from index to /blog does not work).

Here is my repo: https://github.com/wouter-dev/Amai

Is there someone who can explain to me how to add a index page to this starter and change the current index to blog.js?

Running "gatsby build" throws a GLib error?

Hi, I just cloned this repo, installed dependencies, didn't touch the .ghost.json file, and just ran gatsby build.

It ran fine until the "Building static HTML for pages" step, and then sharp throws an error for some reason that I can't see (I've tried yarn serve as well):

(sharp:50470): GLib-CRITICAL **: 23:13:37.186: g_hash_table_lookup: assertion 'hash_table != NULL' failed

And here's the screenshot: https://i.imgur.com/XKKmcSK.png.

For reference, I'm using node v12.8.0, yarn 1.17.3, and ghost 2.21.0 running on heroku using this template.

I don't know what could be causing this... given the sharp error, I'm guessing the problem's on the static site generation end (instead of the headless CMS end).

"gatsby-plugin-advanced-sitemap" threw an error while running the onPostBuild lifecycle:

After Updating the Sitemap Plugin Got this Error while Building Production site

$ gatsby build
success open and validate gatsby-configs - 1.406 s
success load plugins - 12.178 s
success onPreInit - 0.016 s
success delete html and css files from previous builds - 0.224 s
info One or more of your plugins have changed since the last time you ran Gatsby. As
a precaution, we're deleting your site's cache to ensure there's not any stale
data
success initialize cache - 0.115 s
success copy gatsby files - 0.289 s
success onPreBootstrap - 1.889 s
success source and transform nodes - 2.003 s
success building schema - 0.662 s
success createPages - 0.192 s
success createPagesStatefully - 0.047 s
success onPreExtractQueries - 0.039 s
success update schema - 0.045 s
success extract queries from components - 0.917 s
success write out requires - 0.043 s
success write out redirect data - 0.025 s
success onPostBootstrap - 0.021 s

info bootstrap finished - 69.467 s

success run static queries - 0.101 s — 5/5 60.63 queries/second
success Building production JavaScript and CSS bundles - 17.734 s
success Rewriting compilation hashes - 0.021 s
success run page queries - 0.350 s — 18/18 55.27 queries/second
success Building static HTML for pages - 4.760 s — 18/18 19.28 pages/second

 ERROR #11321  PLUGIN

"gatsby-plugin-advanced-sitemap" threw an error while running the onPostBuild lifecycle:

Cannot read property 'addUrl' of undefined



  TypeError: Cannot read property 'addUrl' of undefined
  
  - SiteMapManager.js:69 SiteMapManager.addUrls
    [san-status]/[gatsby-plugin-advanced-sitemap]/SiteMapManager.js:69:23
  
  - gatsby-node.js:349 
    [san-status]/[gatsby-plugin-advanced-sitemap]/gatsby-node.js:349:27
  
  - Array.forEach
  
  - gatsby-node.js:347 _loop3
    [san-status]/[gatsby-plugin-advanced-sitemap]/gatsby-node.js:347:30
  
  - gatsby-node.js:354 
    [san-status]/[gatsby-plugin-advanced-sitemap]/gatsby-node.js:354:17
  
  - Array.forEach
  
  - gatsby-node.js:345 _callee2$
    [san-status]/[gatsby-plugin-advanced-sitemap]/gatsby-node.js:345:82

Stop hand-rendering JSON

Issue Summary

Evidently we're trying to hand-render JSON rather than create an object and use JSON.stringify() on it, which is not kosher:

<script type="application/ld+json">{`
{
"@context": "https://schema.org/",
"@type": "Article",
"author": {
"@type": "Person",
"name": "${author.name}",
${author.image ? author.sameAsArray ? `"image": "${author.image}",` : `"image": "${author.image}"` : ``}
${author.sameAsArray ? `"sameAs": ${author.sameAsArray}` : ``}
},
${publicTags.length ? `"keywords": "${_.join(publicTags, `, `)}",` : ``}
"headline": "${ghostPost.meta_title || ghostPost.title}",
"url": "${canonical}",
"datePublished": "${ghostPost.published_at}",
"dateModified": "${ghostPost.updated_at}",
${shareImage ? `"image": {
"@type": "ImageObject",
"url": "${shareImage}",
"width": "${config.shareImageWidth}",
"height": "${config.shareImageHeight}"
},` : ``}
"publisher": {
"@type": "Organization",
"name": "${settings.title}",
"logo": {
"@type": "ImageObject",
"url": "${publisherLogo}",
"width": 60,
"height": 60
}
},
"description": "${ghostPost.meta_description || ghostPost.excerpt}",
"mainEntityOfPage": {
"@type": "WebPage",
"@id": "${config.siteUrl}"
}
}
`}</script>

This results, of course, in broken JSON.

For example:
image (2)

On the left side, is Ghost's front-end, which correctly uses JSON.stringify(). On the right, is the same post in this Gatsby starter project, which has broken JSON as you can see.

This is how the Ghost front-end does it, using real objects:
https://github.com/TryGhost/Ghost/blob/a9050f68ea0d397809c9e1900c4edbdd474b4388/core/frontend/meta/schema.js#L66-L106

Editing Ghost Post HTML

Hi - does anyone know how I'd go about editing the generated Ghost Post HTML? I want to add custom css classes without doing custom html for each post.

Errors on first run

Trying to get this up and running and after I install it with the command

gatsby new project-name https://github.com/TryGhost/gatsby-starter-ghost.git

And run gatsby develop, I get the following error. A regular Gatsby install works fine, for what it's worth.

ERROR 

The above error occurred in the <ReduxStoreProvider> component:
    in ReduxStoreProvider
    in App

React will try to recreate this component tree from scratch using the error boundary you provided, App.


 ERROR 

Warning: App: Error boundaries should implement getDerivedStateFromError(). In that method, return a state update to display an error message or fallback UI.


 ERROR 

UNHANDLED REJECTION Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem.



  Error: Invariant Violation: Invalid hook call. Hooks can only be called inside   of the body of a function component. This could happen for one of the followi  ng reasons:
  1. You might have mismatching versions of React and the renderer (such as Reac  t DOM)
  2. You might be breaking the Rules of Hooks
  3. You might have more than one copy of React in the same app
  See https://fb.me/react-invalid-hook-call for tips about how to debug and fix   this problem.
  
  - react.development.js:1607 
    [project-name]/[gatsby]/[react]/cjs/react.development.js:1607:26
  
  - react.development.js:1610 resolveDispatcher
    [project-name]/[gatsby]/[react]/cjs/react.development.js:1610:5
  
  - react.development.js:1636 useState
    [project-name]/[gatsby]/[react]/cjs/react.development.js:1636:20
  
  - index.js:28 ReduxStoreProvider
    [project-name]/[gatsby]/[gatsby-cli]/lib/reporter/loggers/ink/index.js:28:41
  
  - react-reconciler.development.js:5671 renderWithHooks
    [project-name]/[react-reconciler]/cjs/react-reconciler.development.js:5671:18
  
  - react-reconciler.development.js:7905 mountIndeterminateComponent
    [project-name]/[react-reconciler]/cjs/react-reconciler.development.js:7905:13
  
  - react-reconciler.development.js:9049 beginWork$1
    [project-name]/[react-reconciler]/cjs/react-reconciler.development.js:9049:16
  
  - react-reconciler.development.js:10317 Object.invokeGuardedCallbackImpl
    [project-name]/[react-reconciler]/cjs/react-reconciler.development.js:10317:10
  
  - react-reconciler.development.js:10501 invokeGuardedCallback
    [project-name]/[react-reconciler]/cjs/react-reconciler.development.js:10501:31
  
  - react-reconciler.development.js:14014 beginWork$$1
    [project-name]/[react-reconciler]/cjs/react-reconciler.development.js:14014:7

Technical details:

  • Ghost Version: 1.11.0
  • Gatsby Version: 2.15.18
  • Gatsby-CLI Version: 2.8.1
  • Node Version: 10.16.3
  • OS: Ubuntu 18.04

The machine is a relatively fresh install of Ubuntu, there's little installed other than Node and NPM. I've also tried it on a Windows 10 machine with the same Node, Ghost, Gatsby & Gatsby-CLI version.

Security issues with js-yaml and deprecated version of hapi

Ran gatsby new gatsby-starter-ghost https://github.com/TryGhost/gatsby-starter-ghost.git

Expected: no errors

Actual

The version of hapi in the dependency tree is deprecated

npm WARN deprecated [email protected]: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).
npm WARN deprecated [email protected]: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).
npm WARN deprecated [email protected]: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).
npm WARN deprecated [email protected]: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).

Security issues with ja-yaml:

added 1888 packages from 1119 contributors and audited 26325 packages in 42.045s
found 2 vulnerabilities (1 moderate, 1 high)
  run `npm audit fix` to fix them, or `npm audit` for details

npm audit results:

                       === npm audit security report ===                        
                                                                                
# Run  npm install [email protected]  to resolve 2 vulnerabilities
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Moderate      │ Denial of Service                                            │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ js-yaml                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gatsby-plugin-sharp                                          │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gatsby-plugin-sharp > svgo > js-yaml                         │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://npmjs.com/advisories/788                             │
└───────────────┴──────────────────────────────────────────────────────────────┘


┌───────────────┬──────────────────────────────────────────────────────────────┐
│ High          │ Code Injection                                               │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ js-yaml                                                      │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ gatsby-plugin-sharp                                          │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ gatsby-plugin-sharp > svgo > js-yaml                         │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://npmjs.com/advisories/813                             │
└───────────────┴──────────────────────────────────────────────────────────────┘


found 2 vulnerabilities (1 moderate, 1 high) in 26325 scanned packages
  run `npm audit fix` to fix 2 of them.

warning GhostAdminAPI's `host` parameter is deprecated, please use `url` instead

After upgrading the gatsby-source-ghost Plugin
While Building got this warning Message

$ gatsby build

success open and validate gatsby-configs — 0.429 s
success load plugins — 1.201 s
success onPreInit — 0.005 s
success delete html and css files from previous builds — 0.053 s
success initialize cache — 0.012 s
success copy gatsby files — 0.028 s
success onPreBootstrap — 0.020 s
warning GhostAdminAPI's `host` parameter is deprecated, please use `url` instead
success source and transform nodes — 1.472 s
success building schema — 0.657 s
success createPages — 0.094 s
success createPagesStatefully — 0.025 s
success onPreExtractQueries — 0.003 s
success update schema — 0.040 s
success extract queries from components — 0.248 s
success run static queries — 0.062 s — 5/5 82.39 queries/second
success run page queries — 0.264 s — 18/18 68.38 queries/second
success write out page data — 0.004 s
success write out redirect data — 0.001 s
success onPostBootstrap — 0.001 s

info bootstrap finished - 15.485 s

success Building production JavaScript and CSS bundles — 4.230 s
success Building static HTML for pages — 3.979 s — 18/18 22.58 pages/second
done generating icons for manifest
Generated public/sw.js, which will precache 12 files, totaling 332298 bytes.
info Done building in 24.126 sec

PS: Using Latest Ghost Version with API v2
PPS: No warnings in v3.3.0

TypeError: Cannot read property 'concat' of null

error Plugin gatsby-source-ghost returned an error


  TypeError: Cannot read property 'concat' of null
  
  - gatsby-node.js:102 api.settings.browse.then
    [my-gatsby-sitet]/[gatsby-source-ghost]/gatsby-node.js:102:53
  
  - next_tick.js:68 process._tickCallback
    internal/process/next_tick.js:68:7

Plugin Version : Latest (3.4.1)

Excerpt is null in API

Issue Summary

Hi, is excerpt a new field in newest version of Ghost? I've seen a pull request in #11 that changed from custom_excerpt to excerpt but I have problem accessing excerpt on my side. It returns null from my API.

To Reproduce

  1. Changed .ghost.json to my Ghost blog and add credentials.
  2. Run $ gatsby develop

Technical details:

  • Ghost Version: 2.9.1
  • Gatsby Version: 2.3.34
  • Node Version: v10.5.0
  • OS: macOS 10.13.6

Related Posts plugin

Problem description

It is possible to fetch related posts based on how many tags they have in common. A current implementation of that can be found in the Ghost Docs repository here. This code is very specific to the Ghost Docs requirements and also very messy.

There are probably better solutions to solve this, but this one works and can be a good starting point to create a plugin for the

Proposal

I had a play with this already, trying to add related posts to the GraphQL schema, but wasn't successful. This might be due to my lack of GraphQL knowledge, or simply because it's not possible that way.

The working solution in Ghost Docs inserts the related posts into the PageContext which is another option (not such a nice one, as having it available with a pretty GraphQL query) to implement this.

Maybe (probably) there are even better ways on doing that? This needs further research.

Todos

  • investigate do-ability and different options further
  • write up tech spec and agree on solution with core team
  • implement a general plugin for related Ghost posts, that can be configured
  • publish plugin

Sharp module fails to install when running gatsby develop

Issue Summary

gatsby-starter-ghost doesn't build; ie. "gatsby develop" fails for the gatsby-starter-ghost project.

To Reproduce

  1. gatsby new gatsby-starter-ghost https://github.com/TryGhost/gatsby-starter-ghost.git
  2. yarn
  3. gatsby develop

Error Output

gatsby_error

I have tried the recommendations in the above image, but I get the same error.

Technical details:

  • Ghost Version: 1.11.0
  • Gatsby Version: 2.14.0
  • Gatsby CLI Version: 2.7.44
  • Node Version: 10.16.3
  • OS: Windows 10

Translate all the helper with gatsby

Hi
I was wondering how to translate the helpers such as the reading time or other string for my gatsby website.
I'm using the gatsby starter ghost boilerplate.
Thanks

RSS feed: Post URLs reference admin URL (not siteUrl)

Issue Summary

RSS feeds generated by generate-feed.js construct post URLs from Ghost admin as opposed to siteConfig.siteUrl. Post URLs should reference URLs of the current theme, as opposed to the apiUrl of Ghost admin.

To Reproduce

  1. Source content from a source in .ghost.json.
  2. Set a site URL in sitConfig.js.
  3. Run gatsby build && gatsby serve
  4. Inspect the resulting post URLs in the RSS feed at http://localhost:9000/rss
  5. Notice that post URLs do not reference posts living on the current Gatsby theme, but rather the Ghost source

Suggested Change

Pass siteUrl to generateItem() and generate post URLs by using url: siteUrl + post.slug instead of url: post.url:

const cheerio = require(`cheerio`)
const tagsHelper = require(`@tryghost/helpers`).tags
const _ = require(`lodash`)

const generateItem = function generateItem(siteUrl, post) {
    const itemUrl = siteUrl + `/` + post.slug
    const html = post.html
    const htmlContent = cheerio.load(html, { decodeEntities: false, xmlMode: true })
    const item = {
        title: post.title,
        description: post.excerpt,
        guid: post.id,
        url: siteUrl + `/` + post.slug,
        date: post.published_at,
        categories: _.map(tagsHelper(post, { visibility: `public`, fn: tag => tag }), `name`),
        author: post.primary_author ? post.primary_author.name : null,
        custom_elements: [],
    }
    let imageUrl

    if (post.feature_image) {
        imageUrl = post.feature_image

        // Add a media content tag
        item.custom_elements.push({
            'media:content': {
                _attr: {
                    url: imageUrl,
                    medium: `image`,
                },
            },
        })

        // Also add the image to the content, because not all readers support media:content
        htmlContent(`p`).first().before(`<img src="` + imageUrl + `" />`)
        htmlContent(`img`).attr(`alt`, post.title)
    }

    item.custom_elements.push({
        'content:encoded': {
            _cdata: htmlContent.html(),
        },
    })
    return item
}

const generateRSSFeed = function generateRSSFeed(siteConfig) {
    return {
        serialize: ({ query: { allGhostPost } }) => allGhostPost.edges.map(edge => Object.assign({}, generateItem(siteConfig.siteUrl, edge.node))),
        setup: ({ query: { allGhostSettings } }) => {
            const siteTitle = allGhostSettings.edges[0].node.title || `No Title`
            const siteDescription = allGhostSettings.edges[0].node.description || `No Description`
            const feed = {
                title: siteTitle,
                description: siteDescription,
                // generator: `Ghost ` + data.safeVersion,
                generator: `Ghost 2.9`,
                feed_url: `${siteConfig.siteUrl}/rss/`,
                site_url: `${siteConfig.siteUrl}/`,
                image_url: `${siteConfig.siteUrl}/${siteConfig.siteIcon}`,
                ttl: `60`,
                custom_namespaces: {
                    content: `http://purl.org/rss/1.0/modules/content/`,
                    media: `http://search.yahoo.com/mrss/`,
                },
            }
            return {
                ...feed,
            }
        },
        query: `
        {
            allGhostPost(
                sort: {order: DESC, fields: published_at}
            ) {
                edges {
                    node {
                        # Main fields
                        id
                        title
                        slug
                        featured
                        feature_image

                        # Dates unformatted
                        created_at
                        published_at
                        updated_at

                        # SEO
                        excerpt
                        meta_title
                        meta_description

                        # Authors
                        authors {
                            name
                        }
                        primary_author {
                            name
                        }
                        tags {
                            name
                            visibility
                        }

                        # Content
                        html

                        # Additional fields
                        url
                    }
                }
            }
        }
  `,
        output: `/rss`,
    }
}

module.exports = generateRSSFeed

Technical details:

  • Ghost Version: 2.31.0
  • Gatsby Version: 2.15.20
  • Node Version: 10.16.3

Remove quotes from the alt attribute

😄 I'm playing with ghost and gatsby I'm very excited

— This is the result that comes by default

<img class="site-logo" src="https://static.ghost.org/v1.0.0/images/ghost-logo.svg" alt="{site.title}">

— And this is resolved by removing the quotes from the alt attribute of the image. 😄

<img className="site-logo" src={site.logo} alt="{site.title}" />
: <Img fixed={data.file.childImageSharp.fixed} alt="{site.title}" />

Need to merge gatsby-starter-ghost starter with gatsby-serif-theme starter. How do I achieve this?

I am trying to merge the gatsby-starter-ghost with gatsby-serif-theme. However, with two separate gatsby-config.js and differing project/folder/file structures, I am finding it very difficult to get a breakthrough in going about merging these two templates.

Please note that I want gatsby-starter-ghost starter to be a sub-folder or a page within the src folder of my gatsby-serif-theme main site. My key challenge is to decode two separate gatsby-config.js files (from the two themes) before merging them together and several other assets/files into the main site (in this gatsby-serif-theme).

How do I go about this? Let me know.

--------------^ Click "Preview" for a nicer view!

We use GitHub only for bug reports 🐛

Anything else should be posted to https://forum.ghost.org 👫.

🚨For support, help & questions use https://forum.ghost.org/c/help
💡For feature requests & ideas you can post and vote on https://forum.ghost.org/c/Ideas

Alternatively, check out these resources below. Thanks! 😁.

Assets from cdn in a blog post are not loading after original load

Issue Summary

I'm loading react in a blog post to add a react component to a single blog post. On the first load everything is fine or while using an incognito browser, but on subsequent loads I receive these errors

The FetchEvent for "https://unpkg.com/react-dom@16/umd/react-dom.production.min.js" resulted in a network error response: an "opaque" response was used for a request whose type is not no-cors
The FetchEvent for "https://unpkg.com/react@16/umd/react.production.min.js" resulted in a network error response: an "opaque" response was used for a request whose type is not no-cors

Safari, Firefox, and chrome on mac and windows

To Reproduce

  1. Create a blog bost
  2. Add the following to the blog post in an html block
<div id="react-code-block-container" style="width: 100%"></div>
<script src="https://unpkg.com/react@16/umd/react.production.min.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js" crossorigin></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.26.0/babel.js" crossorigin></script>
<script type="text/babel">
    'use strict';

    const data = {
      color: 'red',
      wheels: 4,
      engine: {
        cylinders: 4,
        size: 2.2
      }
    }
    
    const style = { background: "#001f3f" }

    const codeBlock = (
      <pre style={style}>
      	<code>
        	{JSON.stringify(data, null, 2)}
    	</code>
      </pre>
    );

	ReactDOM.render(codeBlock, document.getElementById('react-code-block-container'));
</script>

Again, first load the component is there, all resources downloaded. On subsequent loads the resources are not loaded.

Technical details:

  • Ghost Version: docker image
  • Gatsby Version: 2.14.0

The netlify builds and serves the site from their cdn

The blog post https://www.cotyhamilton.com/how-to-pretty-print-json-in-html-with-javascript/

The scripts don't show up at all in the network requests when running gatsby locally with the dev server. My ghost installation shows the post correctly though.

GraphQL error on start

Hello,

When I yarn install, yarn dev this project I encounter the following error on Linux:

error GraphQL Error Unknown field `childImageSharp` on type `File`

  file: /home/mquandalle/gatsby-starter-ghost/src/components/common/Layout.js

   1 |
   2 |             query GhostSettings {
   3 |                 allGhostSettings {
   4 |                     edges {
   5 |                         node {
   6 |                             ...GhostSettingsFields
   7 |                         }
   8 |                     }
   9 |                 }
  10 |                 file(relativePath: {eq: "ghost-icon.png"}) {
> 11 |                     childImageSharp {
     |                     ^
  12 |                         fixed(width: 30, height: 30) {
  13 |                             ...GatsbyImageSharpFixed
  14 |                         }
  15 |                     }
  16 |                 }
  17 |             }
  18 |

Is that expected?

Add more Ghost SDK helpers

As there will be more helpers and gatsby-helpers added to Ghost SDK, the starter needs to be updated to use those.

At this current state, there are already a couple of use cases identified:

  • facebook and twitter helper → started WIP PR here
  • schema.org helper for meta data
    ...

Include codeinjection for site and posts

Problem description

codeinjection_head and codeinjection_foot for the site as well as for posts is currently not used in the starter. The reason for that is

a) it's a bit tricky with scripts in React (hence our dirty little script here
b) code injection can contain almost anything, but most likely <script> or <style> tags, which we need to differentiate for reasons that I'll describe further down

  • For site codeinjection we could use a custom html.js but would need to have the Ghost settings available at that point already (needs #20)
  • For posts we would need to use React Helmet and can’t edit our html.js, as we need the codeinjection per post and not global and we’d prefer to add it to the <head> section, like we do in Ghost frontend → https://www.gatsbyjs.org/docs/custom-html/#react-helmet
  • Using React Helmet or html.js requires that we know already if it’s a <script>, <style>, or any other tag we can think of, as it needs to be specified → https://github.com/nfl/react-helmet#reference-guide
  • Injecting it the way we inject the body (dangerouslySetInnerHTML) of a post doesn’t work either, as it needs to be wrapped in a parent element, which then prevents any of the injected tags from being executed. Furthermore, we would have it in our <body> instead of the <head>

Proposal

Differentiate the codeinjection content

One possible solution is to create a parser util that differentiates between <script> and <style> tags and returns e. g. an Object with those values like this:

"script": ["<script>...</script>", "<script>...</script>"],
"style": ["<style>...</style>", "<style>...</style>"]

☝️ This is just one idea and open for discussions/suggestions!

Site codeinjection (settings.codeinjection_head & settings.codeinjection_foot) in html.js

The site codeinjection can be injected into the html.js file. 👉 https://www.gatsbyjs.org/docs/custom-html/ but there is - of course - a tricky part here too: the html.js generation happens before the schema generation and doesn't allow GraphQL queries. This relies therefore on the outcome of #20 is implemented, which is supposed to make those Ghost settings available on pre build time.

Post codeinjection (post.codeinjection_head & post.codeinjection_foot) in post.js and page.js

The codeinjection for the <head> can be solved using React Helmet like described here.

The codeinjection_foot is not clear where to add it, as the recommended way to inject scripts and styles is using React Helmet. If there's no better way possible to insert the codeinjection_foot before the closing </body> tag, it's probably best to use the same implementation as for the head.

Todos

  • Write a parser util that differentiates between the HTML tags delivered in code injection
  • Find a solution for post codeinjection_foot
  • Implement codeinjection for posts
  • Implement codinjection for the site (needs #20)
  • properly parse script tags and make available as codeinjection_scripts

How can i get plaintext?

Moving from mansonry theme to Gatsby Ghost and the problem arised in plain text query, there're text with markdown, carriage returns, images inside [ ], etc

Plugin gatsby-source-ghost returned an error

Running $ gatsby develop produces the following error:

success open and validate gatsby-configs — 0.116 s
success load plugins — 0.274 s
success onPreInit — 0.789 s
success initialize cache — 0.010 s
success copy gatsby files — 0.095 s
success onPreBootstrap — 0.011 s
error Plugin gatsby-source-ghost returned an error


  Error: Request failed with status code 404

  - createError.js:16 createError
    [blog]/[axios]/lib/core/createError.js:16:15

  - settle.js:18 settle
    [blog]/[axios]/lib/core/settle.js:18:12

  - http.js:201 IncomingMessage.handleStreamEnd
    [blog]/[axios]/lib/adapters/http.js:201:11

  - next_tick.js:63 process._tickCallback
    internal/process/next_tick.js:63:19


success source and transform nodes — 0.674 s
success building schema — 0.404 s
success createPages — 0.059 s
success createPagesStatefully — 0.039 s
success onPreExtractQueries — 0.005 s
success update schema — 0.222 s
warning The GraphQL query in the non-page component "/Users/skurilyak/dev/slavakurilyak/blog/src/templates/author.js" will not be run.
warning The GraphQL query in the non-page component "/Users/skurilyak/dev/slavakurilyak/blog/src/templates/page.js" will not be run.
warning The GraphQL query in the non-page component "/Users/skurilyak/dev/slavakurilyak/blog/src/templates/index.js" will not be run.
warning The GraphQL query in the non-page component "/Users/skurilyak/dev/slavakurilyak/blog/src/templates/post.js" will not be run.
warning The GraphQL query in the non-page component "/Users/skurilyak/dev/slavakurilyak/blog/src/templates/tag.js" will not be run.
Exported queries are only executed for Page components. It's possible you're
trying to create pages in your gatsby-node.js and that's failing for some
reason.

If the failing component(s) is a regular component and not intended to be a page
component, you generally want to use a <StaticQuery> (https://gatsbyjs.org/docs/static-query)
instead of exporting a page query.

If you're more experienced with GraphQL, you can also export GraphQL
fragments from components and compose the fragments in the Page component
query and pass data down into the child component — http://graphql.org/learn/queries/#fragments
success extract queries from components — 0.159 s
success run graphql queries — 0.154 s — 8/8 52.07 queries/second
Generating image thumbnails [==============================] 4/4 0.0 secs 100%
success write out page data — 0.007 s
success write out redirect data — 0.001 s
success onPostBootstrap — 0.002 s

info bootstrap finished - 6.54 s

 DONE  Compiled successfully in 2523ms                                                                                                                                                            8:56:22 PM


You can now view gatsby-starter-ghost in the browser.

  http://localhost:8000/

View GraphiQL, an in-browser IDE, to explore your site's data and schema

  http://localhost:8000/___graphql

Note that the development build is not optimized.
To create a production build, use npm run build

ℹ 「wdm」:
ℹ 「wdm」: Compiled successfully.

Steps to Re-Create Issue:

  1. $ sudo mkdir -p ghost
  2. $ sudo chown -R $(whoami) ghost
  3. $ sudo chmod 775 ghost
  4. $ cd ghost
  5. $ ghost install local
  6. $ cd ..
  7. $ gatsby new blog https://github.com/TryGhost/gatsby-starter-ghost.git
  8. $ cd blog
  9. $ yarn
  10. $ gatsby develop

Please advise. Thanks in advance.

RSS feed icon links to gatsby.ghost feed, not to blog feed

Issue Summary

The RSS icon does not point to my blog's RSS feed, but to the gatsby-starter-ghost feed. Ghost is self-hosted on AWS EC2 and deployed to https://homads-blog.netlify.com/ with Netflify using build command gatsby build from Bitbucket repo.

To Reproduce

  1. .ghost.json development set to https://gatsby.ghost.io and production set to
    https://ghost.homads.com.
  2. Ghost set to private mode.
  3. Netlify-Ghost integration configured for Site changed (rebuild).

I expected the RSS icon to point to a https://ghost.homads.com/rss feed. I've confirmed that Netlify rebuilds site from both git commits and changes within Ghost.

https://homads-blog.netlify.com/rss is generated and looks mostly correct, except it shows the site address as https://homads-blog.netlify.com/rss at the top. Posts URLs are correct, however.

I've also tried setting both development and production in my local .ghost.json to point to ghost.homads.com and testing with gatsby develop and gatsby build && gatsby serve, which has the same issues mentioned above.

Technical details:

  • Ghost Version: 2.25.6
  • Gatsby Version: 2.13.3
  • Gatsby CLI Version: 2.7.14
  • Node Version: 10.16.0
  • OS: Ubuntu 18.04.2 LTS (local development)
  • OS: Ubuntu 18.04.2 LTS (Ghost production on AWS)
  • OS: Ubuntu 16.04 (Netlify)

TypeError: Cannot read property 'node' of undefined

Hi, not sure if this is related to the Ghost GraphQL request. This is the first time I'm setting up Gatsby for my Ghost blog. I've cloned locally and run $gatsby develop but I've received this error message: TypeError: Cannot read property 'node' of undefined in several React components. This is weird because using the default Ghost config works but it didn't work after changing the config to my Ghost credentials (the post listing is ok after console.log within PostCard component but the components are not rendered). Any idea? Is it because I'm using older version of Ghost (It's self hosted)?

Screen Shot 2019-05-11 at 8 19 13 PM

GraphQL error on start

My issue is fairly similar to #17, but I'm using a newer version. Just cloned the repo a few minutes ago (on commit 832f18b). I ran the following commands:

gatsby new gatsby-starter-ghost https://github.com/TryGhost/gatsby-starter-ghost.git
yarn
gatsby develop

And here's the error I'm receiving:

GraphQL Error Unknown field `file` on type `Query`

  file: /Users/Celine/…/gatsby-starter-ghost/src/components/common/Layout.js

   1 | 
   2 |             query GhostSettings {
   3 |                 allGhostSettings {
   4 |                     edges {
   5 |                         node {
   6 |                             ...GhostSettingsFields
   7 |                         }
   8 |                     }
   9 |                 }
> 10 |                 file(relativePath: {eq: "ghost-icon.png"}) {
     |                 ^
  11 |                     childImageSharp {

If it helps, I'm on Mac OS X, npm 6.5.0, Gatsby 2.4.8, yarn 1.11.0. Haven't used Gatsby before, so apologies if this is quite basic!

Adding markdown pages and posts outside of Ghost

I want to create a Gatsby static front end that displays posts from two sources:

  1. a Ghost instance
  2. pages written in Markdown

This project is a great starter for feeding from Ghost, just tried it and it works great,
I know there are examples on how to create markdown sites with Gatsby, but I
suppose markdown posts will need to have the same metadata as posts coming from
Ghost. I assume some Graphql query will concatenate a list of posts coming from the two sources, etc.

The idea is to accomodate 2 types of users: developers that prefer markdown and non devs that prefer the Ghost editor.

gatsby-plugin-feed title validation Error

Today I update the Gatsby Plugin Feed plugin from 2.3.6 to 2.3.9
I found this Bug while Building the Gatsby Site

$ gatsby build

success open and validate gatsby-configs - 0.127 s
success load plugins - 0.693 s
success onPreInit - 0.017 s
success delete html and css files from previous builds - 0.027 s
success initialize cache - 0.021 s
success copy gatsby files - 0.043 s

 ERROR #11321  PLUGIN

"gatsby-plugin-feed" threw an error while running the onPreBootstrap lifecycle:

[Config Validation]: "title" is required



  Error: [Config Validation]: "title" is required
  
  - gatsby-node.js:84 _callee$
    [gatsby-starter-ghost]/[gatsby-plugin-feed]/gatsby-node.js:84:19
  

 onPreBootstrap

rollback the Feed Plugin to 2.3.6 it working well

Getting this error

[email protected] postinstall E:\Development\Git\someapp\node_modules\pngquant-bin
node lib/install.js

‼ Response code 503 (Backend unavailable, connection timeout)
‼ pngquant pre-build test failed
i compiling from source
× Error: pngquant failed to build, make sure that libpng-dev is installed
at Promise.all.then.arr (E:\Development\Git\someapp\node_modules\execa\index.js:231:11)

Cannot find module 'core-js/modules/es6.regexp.to-string'

How problem occurs?

After the starter has been initialized by this:

gatsby new gatsby-starter-ghost https://github.com/TryGhost/gatsby-starter-ghost.git

And start the development mode:

npm run dev

The Gatsby occurs an error:

error Cannot find module 'core-js/modules/es6.regexp.to-string'


  Error: Cannot find module 'core-js/modules/es6.regexp.to-string'

  - loader.js:581 Function.Module._resolveFilename
    internal/modules/cjs/loader.js:581:15

  - loader.js:507 Function.Module._load
    internal/modules/cjs/loader.js:507:25

  - loader.js:637 Module.require
    internal/modules/cjs/loader.js:637:17

  - helpers.js:22 require
    internal/modules/cjs/helpers.js:22:18

  - render-page.js:3 webpackUniversalModuleDefinition
    /Users/bigtony/workplace/BigTony666.github.io/gatsby-starter-ghost/public/render-page.j    s:3:287

  - render-page.js:10 Object.<anonymous>
    /Users/bigtony/workplace/BigTony666.github.io/gatsby-starter-ghost/public/render-page.j    s:10:3

  - loader.js:689 Module._compile
    internal/modules/cjs/loader.js:689:30

  - loader.js:700 Object.Module._extensions..js
    internal/modules/cjs/loader.js:700:10

  - loader.js:599 Module.load
    internal/modules/cjs/loader.js:599:32

  - loader.js:538 tryModuleLoad
    internal/modules/cjs/loader.js:538:12

  - loader.js:530 Function.Module._load
    internal/modules/cjs/loader.js:530:3

  - loader.js:637 Module.require
    internal/modules/cjs/loader.js:637:17

  - helpers.js:22 require
    internal/modules/cjs/helpers.js:22:18

  - worker.js:32 Promise
    [gatsby-starter-ghost]/[gatsby]/dist/utils/worker.js:32:35

  - debuggability.js:313 Promise._execute
    [gatsby-starter-ghost]/[bluebird]/js/release/debuggability.js:313:9

  - promise.js:483 Promise._resolveFromExecutor
    [gatsby-starter-ghost]/[bluebird]/js/release/promise.js:483:18

How to fix?

By running:

npm i core-js --save

It will fix the problem.

Any way to optimize images?

I'm struggling to figure out a way to optimize images. I believe I can't use gatsby-image because the images are stored remotely in Ghost. I might be able to use gatsby-image for the featured images if I use gatsby-plugin-remote-images first, because I can find those in GraphQL, but I'm not sure how to write the query for that.

Does anyone have experience doing this who could offer me some guidance?

Publication cover does not get pulled through to resultant gatsby site

Issue Summary

Publication cover does not get pulled through to resultant gatsby site.

To Reproduce

  1. Set a Publication cover in Ghost admin
  2. Confirm the Publication cover is displayed on the Ghost version of the site, confirming an acceptable image

My expectation would be that this Publication cover would be pulled through to the gatsby site?

Technical details:

  • Ghost Version:
    Version 2.27.0
    Environment production
    Database mysql
    Mail SMTP
  • Gatsby Version:
    Gatsby CLI version: 2.7.7
    Gatsby version: 2.13.45
  • Node Version:
    v11.15.0
  • OS:
    Arch Linux

Prism.js plugin

Problem description

Prism.js doesn't work "out of the box" for Ghost posts currently. There is a workaround to use Prism.js, which is used in the Ghost Docs repository here:

class Post extends React.Component {
    componentDidMount() {
        Prism.highlightAll()
    }
   ...
}

This solution only supports basic languages, which handlebars, yaml, and json for example are not being considered as.

Proposal

Similar to the gatsby-remark-prismjs plugin, we can create a plugin for Ghost that does the same for Ghost posts.

Maybe there are other solutions for this. This needs to be investigated further.

Todos

  • investigate do-ability further
  • write up tech spec and agree on solution with core team
  • implement solution
  • publish plugin

Create a custom home page with gatsby-node.js

Hello,
I wanted to know how to create a home page without creating a index.js file in the /pages folder. Indeed, the content of my page is in a page created with ghost ("home" as a slug). I tried to figured it out to do so with Gatsby.

I deleted the page with gatsby-node.js :

  1. When I go to localhost:8000/home - there is the 404 error page and that's I wanted
  2. When I'm on localhost:8000 I still have the error page. I would like to display the content of the home page. That's the problem.

Here is the code in my gatsby-node.js file :

const _ = require(`lodash`)
const Promise = require(`bluebird`)
const path = require(`path`)
const config = require(`./src/utils/siteConfig`)
const {
    paginate
} = require(`gatsby-awesome-pagination`)

/**
 * Here is the place where Gatsby creates the URLs for all the
 * posts, tags, pages and authors that we fetched from the Ghost site.
 */
exports.createPages = ({
    graphql,
    actions
}) => {
    const {
        createPage,
        deletePage
    } = actions

[....]

    /**
     * Pages
     */
    const createPages = new Promise((resolve, reject) => {
        const pageTemplate = path.resolve(`./src/templates/page.js`)

        resolve(
            graphql(`
                {
                    allGhostPage(
                        sort: {order: ASC, fields: published_at},
                        filter: {
                            slug: {ne: "data-schema-page"}
                        }
                    ) {
                        edges {
                            node {
                                slug
                                url
                            }
                        }
                    }
                }`).then((result) => {
                if (result.errors) {
                    return reject(result.errors)
                }

                if (!result.data.allGhostPage) {
                    return resolve()
                }

                const items = result.data.allGhostPage.edges

                _.forEach(items, ({
                    node
                }) => {
                    // This part here defines, that our pages will use
                    // a `/:slug/` permalink.
                    node.url = `/${node.slug}/`

                    if (node.slug === "home") {
                        deletePage(node.slug)
                        createPage({
                            path: '/',
                            component: path.resolve(pageTemplate),

                        })
                    }
                    createPage({
                        path: node.url,
                        component: path.resolve(pageTemplate),
                        context: {
                            // Data passed to context is available
                            // in page queries as GraphQL variables.
                            slug: node.slug,
                        },
                    })
                })

                return resolve()
            })
        )
    })




    return Promise.all([createPosts, createTags, createPages])
}

Thanks in advance for your help
Kind regards
Maral

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.