Installation
We provide three different ways to install reveal.js depending on your use case and technical experience.
- The basic setup is the easiest way to get started. No need to set up any build tools.
- The full setup gives you access to the build tools needed to make changes to the reveal.js source code. It includes a web server which is required if you want to load external Markdown files (the basic setup paired with your own choice of local web server works too).
- If you want to use reveal.js as a dependency in your project, you can install from npm.
Next Steps
Once reveal.js is installed, we recommend checking out the Markup and Config Option guides.
Basic Setup
We make a point of distributing reveal.js in a way that it can be used by as many people as possible. The basic setup is our most broadly accessible way to get started and only requires that you have a web browser. There's no need to go through a build process or install any dependencies.
- Download the latest reveal.js version https://github.com/hakimel/reveal.js/archive/master.zip
- Unzip and replace the example contents in index.html with your own
- Open index.html in a browser to view it
That's it 🚀
Full Setup - Recommended
Some reveal.js features, like external Markdown, require that presentations run from a local web server. The following instructions will set up such a server as well as all of the development tasks needed to make edits to the reveal.js source code.
Install Node.js (10.0.0 or later)
Clone the reveal.js repository
$ git clone https://github.com/hakimel/reveal.js.git
Move to the reveal.js folder and install dependencies
$ cd reveal.js && npm install
Serve the presentation and monitor source files for changes
$ npm start
Open http://localhost:8000 to view your presentation
Development Server Port
The development server defaults to port 8000. You can use the port
argument to switch to a different one:
npm start -- --port=8001
Installing From npm
The framework is published to, and can be installed from, npm. Note that reveal.js is targeted at the browser and includes CSS, fonts and other assets so the npm dependency use case may be limited.
npm install reveal.js
# or
yarn add reveal.js
Once installed, you can include reveal.js as an ES module:
import Reveal from 'reveal.js';
import Markdown from 'reveal.js/plugin/markdown/markdown.esm.js';
let deck = new Reveal({
plugins: [Markdown],
});
deck.initialize();
You'll also need to include the reveal.js styles and a presentation theme.
<link rel="stylesheet" href="/node_modules/reveal.js/dist/reveal.css" />
<link rel="stylesheet" href="/node_modules/reveal.js/dist/theme/black.css" />