Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/asnunes/notion-page-to-html
NodeJS tool to convert public Notion pages to HTML from page ID
https://github.com/asnunes/notion-page-to-html
equation html html5 notion-pages
Last synced: 1 day ago
JSON representation
NodeJS tool to convert public Notion pages to HTML from page ID
- Host: GitHub
- URL: https://github.com/asnunes/notion-page-to-html
- Owner: asnunes
- License: mit
- Created: 2020-07-23T14:06:05.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2023-01-06T12:35:18.000Z (about 2 years ago)
- Last Synced: 2024-12-29T07:13:02.762Z (9 days ago)
- Topics: equation, html, html5, notion-pages
- Language: TypeScript
- Homepage:
- Size: 821 KB
- Stars: 167
- Watchers: 6
- Forks: 45
- Open Issues: 11
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-notion - Notion Page to HTML - NodeJS tool to convert public notion pages to HTML. (APIs)
README
![Cover image](docs/cover.png)
# Notion Page To HTML
NodeJS tool to convert public notion pages to HTML.
Also available as public API:
[https://notion-page-to-html-api.vercel.app/](https://notion-page-to-html-api.vercel.app/)
## Supported features
Most of the native Notion blocks are currently supported:
- Headings
- Text With Decorations
- Quote
- Image
- YouTube Videos
- Code
- Math Equations
- To-do
- Checkbox
- Bulleted Lists
- Numbered Lists
- Toggle Lists
- Divider
- Callout
- Nested blocksEmbeds and tables are not supported yet.
## Why notion-page-to-html?
It's perfect as content manager system
- This tool can get any public page from Notion and convert it to html. This is perfect
for the ones who want to use Notion as CMS. Once it gets page content from Notion, it becomes completely independent (images are converted to base64 so you do not have to call Notion again to get content). You can convert a page and then make it private again.It's fully customizable
- You can choose how you want to get page content. Do you want title, cover, and icon in html body? You can do that! Do you want they apart of html so you can choose where place it? You have it. Do want html without style? Without Equation and Code Highlighting scripts? Do you want body content only? You have those options too.
## Basic Usage
Install it in a NodeJS project using npm
```bash
npm install notion-page-to-html
```Then, just import it and paste a public Notion page url
```jsx
const NotionPageToHtml = require('notion-page-to-html');// using async/await
async function getPage() {
const { title, icon, cover, html } = await NotionPageToHtml.convert("https://www.notion.so/asnunes/Simple-Page-Text-4d64bbc0634d4758befa85c5a3a6c22f");
console.log(title, icon, cover, html);
}getPage();
````cover` is a base64 string from original page cover image. `icon` can be an emoji or base64 image based on original page icon. `html` is a full html document by default. It has style, body, MathJax and PrismJS CDN scripts by default. You can pass some options to handle html content.
```jsx
NotionPageToHtml.convert(
'https://www.notion.so/asnunes/Simple-Page-Text-4d64bbc0634d4758befa85c5a3a6c22f',
options,
);
````options` is an object with the following keys
| Key | Default value | If true |
| ----------------------- | ------------- | ------------------------------------------------------ |
| `excludeCSS` | false | returns html without style tag |
| `excludeMetadata` | false | returns html without metatags |
| `excludeScripts` | false | returns html without script tags |
| `excludeHeaderFromBody` | false | returns html without title, cover and icon inside body |
| `excludeTitleFromHead` | false | returns html without title tag in head |
| `bodyContentOnly` | false | returns html body tag content only |---
## Development and testing
1. Clone this application
2. Make sure you have node v14 or higher and then install all dependencies
````
npm i
````
Running tests:````
npm test
````Installing locally in another project:
````
npm run build
npm pack
````
Inside your project:
````
npm i /path/to/tar/gz
````Docker approach for testing
1. Make sure you have Docker and Docker Compose installed and then run:
````
make test
````## Contributing
We love your feedback! Feel free to:
- Report a bug
- Discuss the current state of the code
- Submit a fix
- Propose new features
- Become a maintainerJust create a GitHub issue or a PR ;)