These docs are for an old release. Info on upgrading to v4
edit doc

Loading the Code

You must first get FullCalendar’s code loaded onto the page before initializing a calendar. You can write your own script tags or you can use a build system like Webpack.

Script Tags

First, download a ZIP from the releases page. After unzipping, find the files fullcalendar.js and fullcalendar.css.

Then, download the JavaScript files for FullCalendar’s two dependencies: jQuery and Moment.

Then, write something like this in the <head> of your page:

<link rel='stylesheet' href='fullcalendar/fullcalendar.css' />
<script src='lib/jquery.min.js'></script>
<script src='lib/moment.min.js'></script>
<script src='fullcalendar/fullcalendar.js'></script>

It is important that you load jQuery and Moment’s JS files before loading FullCalendar’s JS files.

As an NPM module (Webpack / Browserify)

Use NPM to install FullCalendar:

npm install jquery moment fullcalendar

Then, you must install a build system like Webpack or Browserify that will automatically bundle all of your code. See an example repo that uses Webpack »

Then, write a module that imports both jQuery and FullCalendar:

import $ from 'jquery';
import 'fullcalendar';

Your import for fullcalendar does not need to be named. It will attached to jQuery as a plugin. In the next section, you will learn how to use jQuery to initialize a calendar.

You must also include FullCalendar’s stylesheet somehow, either manually with a <link> tag or via Webpack’s css-loader.