Comments (5)
Could you give more concrete examples to explain what you'd like to? I can't get it what you mean. I'd to see actual input/output you desire. It'll be great if you propose with actual pull-request.
Or I recommend building another loader to realize your needs by yourself.
from frontmatter-markdown-loader.
@hmsk sure, at the moment, i parsed the footnotes array from attributes section, so i only pass strings to the object keys. I want to add multiple markdown section in the body, which i can access over dynamic variables. In principle exactly the same as with the attributes, only that I can write markdown content, such as links, pictures, videos etc:
---
Titel: Post 1
Subtitle: Blog Post Number 1
---
// Page body
# Heading 1
This is sample text
---
// access over attributes.footnote1.title
id: footnote 1
title: Footnote 1
---
// content of footnote 1
// access over attributes.footnote1.body -> rendered as html
# Footnote 1
This is a paragraph for footnote 1
[This is a link](https://example.com)
---
// access over attributes.footnote2.title
id: footnote 2
title: Footnote 2
---
// content of footnote 2
// access over attributes.footnote2.body -> rendered as html
# Footnote 2
This is a paragraph for footnote 2
Maybe so. It is important to me that I do not have to create an extra own markdown file for every footnote or any additional content. I hope you understand now what I mean...
from frontmatter-markdown-loader.
Thanks for your explanation. I didn't find the exact benefit which lets me accept to add such the complexity. The loader just focuses on importing the frontmatter-markdown file as "front matter attributes" and "compiled markdown".
I want to add multiple markdown section in the body
I don't think that's no longer "frontmatter markdown". Front-matter attributes come to the top of the markdown once. If you intend to import such the file which has multiple frontmatter markdowns, I recommend you to create another Webpack loader (that may wrap this loader).
Btw, to build structural data, this doesn't work for you?
title: Title
subtitle: SubTitle
footnotes:
- id: Footnote 1
title: first footnote
- id: Footnote 2
title: second footnote
from frontmatter-markdown-loader.
@UIX-Design I suppose your case is similar to mine #61 and you want to use Markdown for the content of the footnotes. You can give it a try to my fork and pass the option multiple: true
.
To install it, replace the "frontmatter-markdown-loader"
entry in your package.json
with:
"frontmatter-markdown-loader": "github:delapuente/frontmatter-markdown-loader#multiple"
Notice this version is a modification of the master
version of the loader. A typical configuration is:
{
test: /\.md$/,
loader: 'frontmatter-markdown-loader',
options: {
multiple: true
}
}
Now you can name your footnotes:
---
Titel: Post 1
Subtitle: Blog Post Number 1
---
# Heading 1
This is sample text
---footnote-1
id: footnote 1
title: Footnote 1
---
# Footnote 1
This is a paragraph for footnote 1
[This is a link](https://example.com)
---footnote-2
id: footnote 2
title: Footnote 2
---
# Footnote 2
This is a paragraph for footnote 2
With the multiple option enabled, you can do:
import post from 'post-with-footnotes.md'
const footnotesArray = Object.keys(post.namedDocs)
.filter(key => key.startsWith('footnote'))
.map(footnoteName => post.namedDocs[footnoteName]);
footnotesArray.forEach(footnote => {
console.log(footnote.attributes);
console.log(footnote.html);
});
You can still access the post properties through post.attributes
and post.html
.
from frontmatter-markdown-loader.
Another important use case for this is Netlify CMS i18n. I have something like this in my Markdown files:
---
de:
title: Home
date: 2019-03-17T19:31:20.591Z
body: |-
Etwas auf dem **Weg**### Sample netflifycms with next.js page
en:
title: Home
date: 2019-03-17T19:31:20.591Z
body: >
# Look at the repository to check it out [link](https://github.com/masives/netlifycms-nextjs/tree/master/content/blogPosts).
Since only automatic static site generation and listing blogposts is different from documented tutorial I've not documented rest. You can find instructions [here](https://www.netlifycms.org/docs/nextjs/)
---
The body has to be specified in multiple languages and isn't formatted to HTML this way.
from frontmatter-markdown-loader.
Related Issues (20)
- Pure date gets parsed into UTC timestamp HOT 1
- How can we access the markdown attributes right from nuxt.config.js? HOT 1
- Using markdown-it plugin breaks the subcomponents inside the markdown file in nuxt HOT 6
- Vue component appears to be parsing mustache tags within code snippets HOT 5
- component HOT 1
- How can we enable code highlighting for markdown ? HOT 1
- How to install highlight.js with frontmatter-markdown-loader ? HOT 1
- Missing line breaks in code snippet HOT 5
- Cannot stringify POJOs with symbolic keys Symbol(Symbol.toStringTag) HOT 1
- How to use within a nuxt payload dynamic route HOT 1
- Using the dynamic example B, I am unable to render local components in markdown HOT 2
- Any way of using dynamic data from database for vue components?
- Is there a way to get last modified date and time of md file HOT 2
- Action Required: Fix Renovate Configuration
- vue: Unknown custom element from .md HOT 3
- Using style-tag breaks .md file HOT 5
- Vue component mode doesn't work on Vue 3 project due to this plugin is stuck on Vue 2 compiler; `vue-template-compiler` HOT 9
- Jest Transformer for the Loader
- Dependency Dashboard
- how to set attributes
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from frontmatter-markdown-loader.