Skip to content

Instantly share code, notes, and snippets.

@gustavlrsn

gustavlrsn/Layout.js

Created May 1, 2017 18:11
Show Gist options
  • Star 20 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save gustavlrsn/509694de7f4ee5a5d720d218b21f288e to your computer and use it in GitHub Desktop.
Save gustavlrsn/509694de7f4ee5a5d720d218b21f288e to your computer and use it in GitHub Desktop.
Download ZIP
Example bootstrap 4 integration into Next.js, with the reactstrap package
Raw
Layout.js
import Head from 'next/head'
import { Container } from 'reactstrap'
const Layout = (props) => (
<div>
<Head>
<title>PairHub</title>
<meta name="viewport" content="initial-scale=1.0, width=device-width" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" />
</Head>
<Container>
{props.children}
</Container>
</div>
)
export default Layout
@ModernHooman
Copy link

I get the following error when using this approach.

Unexpected token export
C:\Users\user\WebstormProjects\site_ui\node_modules\react-popper\lib\react-popper.js:1
(function (exports, require, module, __filename, __dirname) { export { default as Manager } from './Manager';
^^^^^^

    SyntaxError: Unexpected token export
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:607:28)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)
    at tryModuleLoad (module.js:499:12)
    at Function.Module._load (module.js:491:3)
    at Module.require (module.js:587:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Users\user\WebstormProjects\site_ui\node_modules\reactstrap\dist\reactstrap.cjs.js:14:19)
        at Module._compile (module.js:643:30)
        at Object.Module._extensions..js (module.js:654:10)
        at Module.load (module.js:556:32)
        at tryModuleLoad (module.js:499:12)
        at Function.Module._load (module.js:491:3)
        at Module.require (module.js:587:17)

any idea about fixing react-popper.js?

@amartincaro
Copy link

I'm having the exact same error that @hooman-limouee. Any ideas?

@DavyBello
Copy link

DavyBello commented Mar 2, 2018 •
edited

@hooman-limouee downgrading reactstrap to v5.0.0-beta fixed this issue for me

@bruno-ortiz
Copy link

@DavyBello downgrading didn't work here, did you do anything else?

@Vadorequest
Copy link

Same issue with react-popper on beta-2

@Vadorequest
Copy link

Vadorequest commented Mar 10, 2018 •
edited

Switching back to v5.0.0-beta worked for me too.

@Vadorequest
Copy link

Official Reactstrap Issue about it: reactstrap/reactstrap#870 with workaround explained

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment