diff --git a/src/components/App.js b/src/components/App.js
index f95f9c31..05a0d3cd 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -1,5 +1,5 @@
 import React from 'react'
-import Menu from './Menu'
+import { Menu } from './Menu'
 import Footer from './Footer'
 import Comments from './Comments'
 
diff --git a/src/components/Menu.js b/src/components/Menu.jsx
similarity index 93%
rename from src/components/Menu.js
rename to src/components/Menu.jsx
index 39308008..e757de18 100644
--- a/src/components/Menu.js
+++ b/src/components/Menu.jsx
@@ -1,4 +1,4 @@
-const React = require('react')
+import React from 'react'
 const getPathWithNoTrailingSlas = require('../lib/url').getPathWithNoTrailingSlash
 
 const hasSubmenu = item => !!item.items
@@ -24,7 +24,7 @@ const MenuToggle = () => (
 	</div>
 )
 
-const Menu = ({items}) => {
+export const Menu = ({items}) => {
 	const content = items.map((item, index) => (
 		<li key={index}
 			className={`HMenu__item ${hmenuCurClassName(item.highlighted)} ${item.color} ${selectedClassName(item.highlighted)}`}
@@ -54,5 +54,3 @@ const Submenu = ({items}) => (
 		))}
 	</menu>
 )
-
-module.exports = Menu