Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Convert Jupyter (IPython) Notebooks to static HTML

License

NotificationsYou must be signed in to change notification settings

jirutka/ipynb2html

Repository files navigation

CI Status

ipynb2html is a converter (renderer) of theJupyter Notebook Format 4.0+ to static HTML.It works both in Node.js and browser environment.

Packages

This repository contains the following packages, all published onnpm.

ipynb2html-core

Version on npmMinified bundle size

This package provides the converter itself and some utilities withno dependencies.You have to provide your own syntax highlighter and Markdown, math and ANSI sequences renderer; or not, if you don’t need them.

ipynb2html

Version on npmMinified bundle size

This package builds on the ipynb2html-core and provides a complete, ready-to-go renderer configured with:

It also provides a reference stylesheet which you can find indist/notebook.min.css (or non-minifiedstyles/notebook.css).

ipynb2html-cli

Version on npmMinified bundle size

This package provides a CLI interface for ipynb2html.

Installation

All thepackages can be installed usingnpm oryarn fromnpmjs.com.

Standalone CLI Tool

ipynb2html-cli is also provided as a single minified JavaScript with all the external dependencies bundled in.It requires only Node.js (version 10 or newer) to be installed on the system.

The archive also contains source maps (useful for debugging).

If you useAlpine Linux, you can also install it from packageipynb2html.

Usage

CLI

ipynb2html notebook.ipynb notebook.html

Runipynb2html --help for more information.

Node.js (server-side)

To render HTML in Node.js (server-side rendering), you need some (fake) DOM implementation.The recommended one isnodom — it’s lightweight,small, doesn’t have any external dependencies and ipynb2html is tested against it.However, you can choose any other if you like.

npm install ipynb2html nodom
import*asfsfrom'fs'import*asipynbfrom'ipynb2html'import{Document}from'nodom'constrenderNotebook=ipynb.createRenderer(newDocument())constnotebook=JSON.parse(fs.readFileSync('./example.ipynb','utf8'))console.log(renderNotebook(notebook).outerHTML)

Browser (client-side)

You have basically two options how to use ipynb2html in the browser: use the browser bundles provided in the ipynb2html package, or build your own bundle (using e.g.Rollup orwebpack).

The provided bundles are in UMD format (AMD, CommonJS and IIFE in one file), so they should work in all environments (old and modern browsers, Node.js).They are transpiled and have injectedcore-js polyfills to be compatible with browsers that have>0.5% global coverage, Firefox ESR, and not dead browsers.

Full Bundle

ipynb2html-full.min.js is a self-contained bundle with all the external dependencies included (marked, KaTeX, Anser and Highlight.js).

You can link it fromjsDelivr CDN, for example:

<!DOCTYPE html><html><head><metacharset="utf-8"><linkrel="stylesheet"href="https://cdn.jsdelivr.net/npm/ipynb2html@0.4.0-rc.1/dist/notebook.min.css"crossorigin="anonymous"><linkrel="stylesheet"href="https://cdn.jsdelivr.net/npm/katex@0.16.3/dist/katex.min.css"crossorigin="anonymous"><linkrel="stylesheet"href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.7.3/build/styles/default.min.css"crossorigin="anonymous"><scriptsrc="https://cdn.jsdelivr.net/npm/ipynb2html@0.4.0-rc.1/dist/ipynb2html-full.min.js"crossorigin="anonymous"></script></head>  ...</html>

The bundle exposes global variableipynb2html:

constelement=ipynb2html.render(notebook)document.body.appendChild(element)

ipynb2html also provides functionautoRender that renders each notebook on the page embedded (as JSON) inside<script type="application/x-ipynb+json">...</script>.[1]

<!DOCTYPE html><html><head><metacharset="utf-8"><linkrel="stylesheet"href="https://cdn.jsdelivr.net/npm/ipynb2html@0.4.0-rc.1/dist/notebook.min.css"crossorigin="anonymous"><linkrel="stylesheet"href="https://cdn.jsdelivr.net/npm/katex@0.16.3/dist/katex.min.css"crossorigin="anonymous"><linkrel="stylesheet"href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.7.3/build/styles/default.min.css"crossorigin="anonymous"><scriptdefersrc="https://cdn.jsdelivr.net/npm/ipynb2html@0.4.0-rc.1/dist/ipynb2html-full.min.js"crossorigin="anonymous"onload="ipynb2html.autoRender();"></script></head><body><main><scripttype="application/x-ipynb+json">{"cells":[ ...],"metadata":{ ...},"nbformat":4,"nbformat_minor":3}</script></main></body><html>

Slim Bundle

ipynb2html.min.js contains only ipynb2html and ipynb2html-core code (plus polyfills).If you load marked, KaTeX, AnsiUp, and Highlight.js in the page, you will get the same functionality as withipynb2html-full.min.js:

<!DOCTYPE html><html><head><linkrel="stylesheet"href="https://cdn.jsdelivr.net/npm/katex@0.16.3/dist/katex.min.css"crossorigin="anonymous"><linkrel="stylesheet"href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.7.3/build/styles/default.min.css"crossorigin="anonymous"><scriptsrc="https://cdn.jsdelivr.net/npm/marked@4.1.1/marked.min.js"crossorigin="anonymous"></script><scriptsrc="https://cdn.jsdelivr.net/npm/ansi_up@5.0.1/ansi_up.js"crossorigin="anonymous"></script><scriptsrc="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.7.3/build/highlight.min.js"crossorigin="anonymous"></script><scriptsrc="https://cdn.jsdelivr.net/npm/katex@0.16.3/dist/katex.min.js"crossorigin="anonymous"></script><scriptsrc="https://cdn.jsdelivr.net/npm/ipynb2html@0.4.0-rc.1/dist/ipynb2html.min.js"crossorigin="anonymous"></script></head>  ...</html>

Or you may use any other implementations and provide them to theipynb2html.createRenderer function.All of them are optional, but you usually need at least a Markdown renderer.

Development

System Requirements

Used Tools

  • TypeScript the language

  • ttypescript wrapper fortsc allowing to use custom AST transformers

  • yarn for dependencies management and building

  • ESLint for linting JS/TypeScript code

  • Jest for testing

  • Rollup for building single-file bundles

How to Start

  1. Clone this repository:

    git clone https://github.com/jirutka/ipynb2html.git
  2. Install Yarn (if you don’t have it already):

    npm install -g yarn
  3. Install all JS dependencies:

    yarn install
  4. Build the project:

    yarn build
  5. Run tests and generate code coverage:

    yarn test
  6. Run linter:

    yarn lint
Important
Keep in mind that JS sources are located in thesrc directories;lib directories contains transpiled code (created after runningyarn build)!

Visual Studio Code

If you use Visual Studio Code, you should install the following extensions:

Credits

License

This project is licensed underMIT License.For the full text of the license, see theLICENSE file.


1. Don’t forget to escape HTML special characters:<,>, and&.

About

Convert Jupyter (IPython) Notebooks to static HTML

Topics

Resources

License

Stars

Watchers

Forks

Sponsor this project

 

[8]ページ先頭

©2009-2025 Movatter.jp