Git Product home page Git Product logo

gatsby-theme-mdxbook's People

Contributors

chrisdhanaraj avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

gatsby-theme-mdxbook's Issues

Trouble starting dev server

A couple of days ago (probably on commit f7dbfdec or so), I was able to build the site and try it with some of my own markdown. However, I deleted that directory, thinking I wouldn't use it again for a while.

Well, here I am, trying to use it again. πŸ˜„However, now when I try to serve the dev site to localhost, I'm getting a few errors.

Context

I'm at 118ba4bf, which is currently the latest commit.

What's odd, however, is that I've checked out multiple previous commits, but now can't get any of them to work.

Errors

I've made sure dependencies are up-to-date (on the main directory, the theme directory, and the example directory):

gatsby-theme-mdxbook/mdxbook-example β†’ master $ yarn
--------------------------------------------------------------------------------------
yarn
yarn install v1.12.3
[1/4] πŸ”  Resolving packages...
success Already up-to-date.
✨  Done in 0.66s.

But I'm running into a number of build issues:

gatsby-theme-mdxbook/mdxbook-example β†’ master $ yarn docs:serve
--------------------------------------------------------------------------------------
yarn run v1.12.3
$ gatsby develop
success open and validate gatsby-configs β€” 0.010 s
success load plugins β€” 0.180 s
success onPreInit β€” 0.769 s
success delete html and css files from previous builds β€” 0.008 s
success initialize cache β€” 0.005 s
success copy gatsby files β€” 0.076 s
success onPreBootstrap β€” 0.005 s
success source and transform nodes β€” 0.089 s
success building schema β€” 0.217 s
β ‚ createPages[ { Error: Cannot read property 'push' of undefined
      at defaultMergedResolver (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/graphql-tools/dist/stitching/defaultMergedResolver.js:15:36)
      at field.resolve (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/graphql-tools/dist/stitching/mergeSchemas.js:214:24)
      at resolveFieldValueOrError (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/graphql/execution/execute.js:531:18)
      at resolveField (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/graphql/execution/execute.js:495:16)
      at /Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/graphql/execution/execute.js:364:18
      at Array.reduce (<anonymous>)
      at executeFields (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/graphql/execution/execute.js:361:42)
      at collectAndExecuteSubfields (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/graphql/execution/execute.js:772:10)
      at completeObjectValue (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/graphql/execution/execute.js:762:10)
      at completeValue (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/graphql/execution/execute.js:660:12)
      at /Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/graphql/execution/execute.js:617:14
      at tryCatcher (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/bluebird/js/release/util.js:16:23)
      at Promise._settlePromiseFromHandler (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/bluebird/js/release/promise.js:512:31)
      at Promise._settlePromise (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/bluebird/js/release/promise.js:569:18)
      at Promise._settlePromise0 (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/bluebird/js/release/promise.js:614:10)
      at Promise._settlePromises (/Users/stephennixon/code/gatsby-theme-mdxbook/node_modules/bluebird/js/release/promise.js:694:18)
    message: "Cannot read property 'push' of undefined",
    locations: [ [Object] ],
    path: [ 'mdx', 'html' ] } ]
error Plugin gatsby-theme-mdxbook returned an error


  TypeError: Cannot read property 'replace' of null

  - parse.js:17 Object.parse
    [gatsby-theme-mdxbook]/[html-parse-stringify]/lib/parse.js:17:10

  - dirTree.js:4 exports.convertHtmlToTree.htmlString
    /Users/stephennixon/code/gatsby-theme-mdxbook/gatsby-theme-mdxbook/utils/dirTree.js:4:21

  - gatsby-node.js:45 graphql.then.result
    /Users/stephennixon/code/gatsby-theme-mdxbook/gatsby-theme-mdxbook/gatsby-node.js:45:32

  - util.js:16 tryCatcher
    [gatsby-theme-mdxbook]/[bluebird]/js/release/util.js:16:23

  - promise.js:512 Promise._settlePromiseFromHandler
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:512:31

  - promise.js:569 Promise._settlePromise
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:569:18

  - promise.js:614 Promise._settlePromise0
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:614:10

  - promise.js:694 Promise._settlePromises
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:694:18

  - promise.js:638 Promise._fulfill
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:638:18

  - promise.js:432 Promise._resolveCallback
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:432:57

  - promise.js:524 Promise._settlePromiseFromHandler
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:524:17

  - promise.js:569 Promise._settlePromise
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:569:18

  - promise.js:614 Promise._settlePromise0
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:614:10

  - promise.js:694 Promise._settlePromises
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:694:18

  - promise.js:638 Promise._fulfill
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:638:18

  - promise.js:582 Promise._settlePromise
    [gatsby-theme-mdxbook]/[bluebird]/js/release/promise.js:582:21


success createPages β€” 0.169 s
success createPagesStatefully β€” 0.013 s
success onPreExtractQueries β€” 0.001 s
success update schema β€” 0.098 s
warning The GraphQL query in the non-page component "/Users/stephennixon/code/gatsby-theme-mdxbook/gatsby-theme-mdxbook/src/templates/Layout/Layout.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.070 s
success run graphql queries β€” 0.017 s β€” 3/3 193.22 queries/second
success write out page data β€” 0.003 s
success write out redirect data β€” 0.000 s
success onPostBootstrap β€” 0.001 s

info bootstrap finished - 4.435 s

(node:74289) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
 DONE  Compiled successfully in 1732ms                                                                                                                                                                                                                                           9:28:21 PM


You can now view mdxbook-example 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 gatsby build

β„Ή ο½’wdmο½£:
β„Ή ο½’wdmο½£: Compiled successfully.
 WAIT  Compiling...                                                                                                                                                                                                                                                              9:28:21 PM

β„Ή ο½’wdmο½£: Compiling...
 DONE  Compiled successfully in 20ms                                                                                                                                                                                                                                             9:28:22 PM

β„Ή ο½’wdmο½£:
β„Ή ο½’wdmο½£: Compiled successfully.

image

I get the same three errors if I try to gatsby develop on the theme directory (though, I don't think I served that directory when I served this locally, a couple days ago).

Previously...

On further-back commits, I do get other errors. However, these don't seem as necessarily relevant, as I'm guessing those have already been debugged:

gatsby-theme-mdxbook/mdxbook-example β†’ 4d04aa6 $ gd
--------------------------------------------------------------------------------------
success open and validate gatsby-configs β€” 0.014 s
success load plugins β€” 0.195 s
success onPreInit β€” 0.841 s
success delete html and css files from previous builds β€” 0.019 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.033 s
success copy gatsby files β€” 0.057 s
success onPreBootstrap β€” 0.006 s
error
The path passed to gatsby-source-filesystem does not exist on your file system:

/Users/stephennixon/code/gatsby-theme-mdxbook/mdxbook-example/src/images

Please pick a path to an existing directory.

See docs here - https://www.gatsbyjs.org/packages/gatsby-source-filesystem/

No rush to fix these, as I probably won't have much time to work with this until next weekend. So, I'll probably just pull at that time and see whether things are working again. πŸ‘

logo + type + color exploration

I did some sketching on paper and on screen, and I'd like to get your thoughts, @chrisdhanaraj.

Logo

image

image

I kept coming back towards book shapes, as these come so readily from combining an M and ↓.

So, none of these are totally final yet, but here are a few directions I like (try to ignore color for now – that can obviously change around):

image

  1. The first is basically an extension of the pictographic logo of MDX, which itself extends a common icon for markdown. I mostly like it, but it's hard to give a similar "monolinear" stroke look to the book icon without it looking like a pizza box, so I had to give it a bit of contrast. If this is a route we like, I might want to play around with this some more.
  2. The second is one direction we could take the book-shape monogram. It's more solid and the arrow is slightly more abstracted.
  3. The third also takes from the book-monogram, but makes it monolinear so the tail of the arrow can be included without the fussy shape that happens if it is kept in the more-solid version. Aside from aesthetics, making it monolinear might allow for some fun CSS animations. If we like this direction, I would play around with angles a bit, to see if the diagonal of the X looks better when parallel with the other lines.

Type

For type, I looked at a few combinations of open-source and system fonts, to make it easy for others to download and run this on their local system. Below are a few I like, but we would obviously want to try these out in the actual theme to get a better idea how they work together.

image

I haven't yet tried these in-context. For some reason, even though I was able to serve the theme example yesterday, it's failing for me today, even on previous commits πŸ€”... However, I think that Inter UI / Plex Serif / a system mono might be my preferred route. I think it would give it a look that is somewhere between default, bookish, and modern.

Color

On the whole, I think it might be fun if the system used a Gatsby-like purple, but its own logo and typographic palette. This would give an indication that it's a Gatsby theme, but allow for its own vibe. Also, purple is just a useful color – it's vibrant while retaining readability. Again, though, this choice would need further design exploration, in the context of the actual theme.

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.