dead simple footnotes, in React
npm install --save react-footnotes
yarn add react-footnotes// esmodulesimport{Footnotes}from'react-footnotes'// commonjsvarFootnotes=require('react-footnotes').FootnotesPass any props you want to read from getFootnotes, to Footnote.
import*asReactfrom'react'import{Footnotes}from'react-footnotes'classAppextendsReact.Component{render(){return(<Footnotes>{({ Footnote, getFootnotes })=>(<React.Fragment><Footnotei={1}desc={`this is a description.`}>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</Footnote> Text that doesnt need to be footnoted, can be passed as normal text.
<Footnotei={2}desc={`this is a description.`}>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</Footnote><Footnotei={3}desc={`this is a description.`}>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</Footnote><Footnotei={4}desc={`this is a description.`}>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</Footnote><ol>{Object.keys(getFootnotes()).map(i=>{return(<likey={`footnote-${i}`}id={`footnote-${i}`}>{getFootnotes()[i].desc}</li>)})}</ol></React.Fragment>)}</Footnotes>)}}- automatically generate the index number so it doesn't have to be passed manually...
npm run dev
# go to http://localhost:1234npm run build