0

We are in the process of converting the existing React App (Created with CRA) to a Razzle App, in order to give serverside rendering for some pages.

We were able to get many things right with the migration, but right now stuck with Reactstrap components (Just checking with a Button component) not being able to render on the server-side. They work fine while rendering on the client-side.

The error I'm getting is,

"error":"Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports."

Code,

import React from "react";
import { Button } from "reactstrap";

const AboutPage = () => {
  return (
    <>
      <div>This is about page</div>
      <div>
        <Button color="danger">Save</Button>
      </div>
    </>
  );
};

export default AboutPage;

I'm not sure if it needs to make any changes in razzle webpack config in order to make this work. If anyone has successfully used Reactstrap components with Razzle SSR, what are the additional steps used to get this working?

Thanks.

Wijitha
  • 1,189
  • 2
  • 12
  • 22

1 Answers1

0

can you try with using import statement like this,

import { Button } from "reactstrap";

can you try recreating app with this, i think newer react is installed

npx create-razzle-app YOUR_APP_NAME --example basic
Ashish Kamble
  • 2,555
  • 3
  • 21
  • 29