shooontan / gatsby-remark-attr Goto Github PK

Hi,

I'm unsure if this is an issue of MDX or remark-attr.

I can't appear to use:

This is a paragraph.{.class-name}

I tried adding 'p' and 'paragraph' to the options.elemets as well.

Did you manage to use this on paragraph text?

I have just upgraded my gatsby version. And I'm getting this error:

I'm not sure if it is a compatibility problem. Any Idea?

This is how my gatsby-config.js looks like:

Hello,
my problem is, that if I try to use gatsby-remark-attr on images, the instruction in the curly braces isn't parsed and is displayed as text under the image. (for example: "{width=100}")
On Hyperlinks it works very well, so this doesn't seem to be my own mistake.

I'm using the following plugins for markdown:

• gatsby-transformer-remark
• gatsby-remark-images
• gatsby-remark-images-medium-zoom
• gatsby-remark-code-buttons

Other plugins:

• gatsby-plugin-typography
• gatsby-source-filesystem
• gatsby-plugin-material-ui
• gatsby-plugin-react-helmet
• gatsby-plugin-sharp
• gatsby-plugin-ffmpeg
• gatsby-plugin-manifest

Is there any way to solve my problem? Maybe your documentation is incomplete and I need an additional plugin?

When you have a chance, can you make the pull request to upgrade your dependent remark-attr package to use the latest version (^0.8.0)? I am stuck running an older version of node (v6.11) on a production machine and cannot upgrade for the foreseeable future, and when building the gatsby site am getting an error at line 177 of node_module/remark-attr/index.js (^0.6.2), specifically the use of unsupported spread operators in objects.

The newer version of remark-attr should fix this issue, as it appears to bypass the use of spread operators. I'm running node v8 on my local machine, and everything works great, but am unfortunately stuck with a lower version of node on the production machine.

Can this be made compatible with gatsby-remark-images? It converts markdown images ![img](/some.jpg) into spans of class gatsby-resp-image-wrapper which don't seem to inherit any specified attributes.

The best I could find so far is to wrap images in working elements:

_![img](/some.jpg)_{style="display: block; width: 300px; margin: auto;"}