Skip to content

Does this support React.lazy component #128

Description

@edwards-afterpay

Below code doesn't work as I expected. Have been running into

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: <ErrorBoundary />. Did you accidentally export a JSX literal instead of a component?

Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

React lazy component

const ProfileLazy = React.lazy(() => import("./Profile"));

const Profile =
    <ErrorBoundary>
    <Suspense fallback={<div>Loading...</div>}>
        <ProfileLazy />
    </Suspense>
</ErrorBoundary>

Angular react2angular wrapper

angular.module("application.module.profile", [])
.controller("application.module.profile.controller",
        ["$rootScope", "$scope", "$controller"],
        function ($rootScope, $scope, $controller) {
            $controller("application.module.controller", {$scope: $scope});
        })
    .component('profile', react2angular(Profile, [], []))

Can I clarify if react2angular will work with the dynamic imports in general, or if there is any issue with the code snippet I have written? Keen to hear your thoughts to understand how can we make this work.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions