fullcalendar-reactWrapper
fullcalendar-reactWrapper copied to clipboard
Not able to load style
import FullCalendar from 'fullcalendar-reactwrapper';
import 'fullcalendar-reactwrapper/dist/css/fullcalendar.min.css';
class Fulcalendar extends Component {
constructor(props) {
super(props);
this.state = {
events: [
{
title: 'All Day Event',
start: '2017-05-01'
},
{
title: 'Long Event',
start: '2017-05-07',
end: '2017-05-10'
},
{
id: 999,
title: 'Repeating Event',
start: '2017-05-09T16:00:00'
},
{
id: 999,
title: 'Repeating Event',
start: '2017-05-16T16:00:00'
},
{
title: 'Conference',
start: '2017-05-11',
end: '2017-05-13'
},
{
title: 'Meeting',
start: '2017-05-12T10:30:00',
end: '2017-05-12T12:30:00'
},
{
title: 'Birthday Party',
start: '2017-05-13T07:00:00'
},
{
title: 'Click for Google',
url: 'http://google.com/',
start: '2017-05-28'
}
],
}
}
render() {
return (
<div id="example-component">
<FullCalendar
id="your-custom-ID"
header={{
left: 'prev,next today myCustomButton',
center: 'title',
right: 'month,basicWeek,basicDay'
}}
defaultDate={'2017-09-12'}
navLinks={true} // can click day/week names to navigate views
editable={true}
eventLimit={true} // allow "more" link when too many events
events={this.state.events}
/>
</div>
);}}
This is my code. Just the sample code from the documentation. Not able to make it work as the stylesheet does not load. I am using Create-react-app for my application.
What version of create-react-app are you using?
@uplAradhana Hey! I recently fixed this issue for myself. I had to download the actual CSS from the zip folder in fullcalendar. Once I downloaded the file, I then put it into /client and imported it into my React component where I was creating the calendar. Hope that helps 😄