Questions tagged [react-loadable]

137 questions
7
votes
0 answers

Unit Testing dynamically imported React Component

I have a very simple React component that uses react-loadable to dynamically import another component. The code looks something akin to the following: import React from 'react'; import Loadable from 'react-loadable'; import LoaderComponent from…
Xenyal
  • 2,136
  • 2
  • 24
  • 51
6
votes
0 answers

How To Avoid Duplicate Code in Chunks Using CRA + Code Splitting

For example, say we have two components with a common import: ... import Hello from './Hello' class A extends Component {} and ... import Hello from './Hello' class B extends Component {} Those components are then…
scoots
  • 715
  • 4
  • 16
6
votes
1 answer

React-loadable gets chunks only from relative path

I'm using webpack 4.6.0 and babel 7.0.0 to build react 16.3 web app. My js assets are under https: //domain/js/app.bundle.js I use react-loadable to split components into chunks. The chunks are also located under /js/, however, react fetches them…
Aus
  • 1,183
  • 11
  • 27
6
votes
3 answers

react-loadable import from multiple class exported js

How to import from a multiple class exported js file in react-loadable. I am trying to import CustomButton from MyButton.js using react-loadable in Home.js. This is the only way I know to do it, is not working. MyButton.js import { CustomButton, …
Midhun G S
  • 906
  • 9
  • 22
5
votes
1 answer

Unhandled Rejection (ChunkLoadError): Loading chunk 1 failed

I am basically trying to do a poc on extracting the some part of my main application into a separate package.A Sample separate package I have built it in my git repo myapp-poc-ui. Now I am trying to access this in my main application. package.json :…
5
votes
0 answers

Lazy loading/react-loadable in React-on-Rails

I want to lazy load all of my top-level components to improve load time. I am using react-on-rails to integrate React and Ruby on Rails. To render the components, I have to register them like so in registration.jsx: import ReactOnRails from…
5
votes
3 answers

Export default unused in WebStorm

I am using loadable in React to load my component dynamically. So I'm exporting the index of each component and import them in app.js. But the issue is I am still getting an error in WebStorm that the export default is unused in individual component…
Deepak Adhana
  • 104
  • 1
  • 8
5
votes
2 answers

React Loadable doesn't update on browser refresh

I have a slide that renders a bunch of cards with some information. The cards height is based on the height of the highest card. I am making use of react-slick for my slider. On the first render the cards are all set to one height, but when i…
RRP
  • 2,563
  • 6
  • 29
  • 52
5
votes
1 answer

React-Loadable SSR with Webpack 4 and Babel 7

Does server-side rendering with react-loadable work with Webpack 4 and Babel 7? I've been unable to get it working successfully while following the instructions. After following just the client-side steps, Webpack correctly outputs separate chunks…
ericgio
  • 3,094
  • 4
  • 25
  • 44
5
votes
0 answers

Basic render test for react loadable components

I have a component that I'm dynamically loading const Summary = loadable({ loader: () => import( /* webpackChunkName: "summary" */ 'app/components/summary') resolveModule: module => module.default, }); Problem: My module wasn't resolving…
Sahil Jain
  • 3,649
  • 2
  • 14
  • 16
5
votes
1 answer

How can I use react-loadable with react-router?

I am trying to implement an application that has 10-15 pages. That works with react-router well but I should use react-loadable to have a Spinner and loading effect ... But how can I import router components inside the loadable ? I should create one…
Mohammad
  • 385
  • 1
  • 4
  • 16
5
votes
0 answers

react-loadable enabled compoent not receiving new props when sent from parent

I have a component that i'm loading via react-loadable. The component that is being loading has some logic in componentWillReceiveProps for detecting if it needs to get some more data, etc. When loaded via react loadable, it calls render 1 time,…
Kelly Milligan
  • 578
  • 1
  • 4
  • 17
5
votes
2 answers

Microfrontends React/Component based splitting

Background: I am confronted with the task to modernize a tool and convert it to microservices with a react frontend. My idea was to have a general top-level component containing e.g. the Nav and a component for each microservice that contains the…
4
votes
1 answer

Preloading with React.lazy

react-loadable exposes a very nice method YourLoadableComponent.preload() thanks to which you can easily preload component before it gets rendered whenever you want (onMouseOver etc). I can see I can do something like:…
dominik791
  • 692
  • 6
  • 17
4
votes
1 answer

A/B testing for React SSR app with chunking

Versions: webpack: 4.30.0, react: 16.8.6, react-loadable: 5.5.0, I'm having one entry JS in webpack. Other chunks are currently created using react-loadable and vendor JS is created using splitChunks. Idea of my application: SSR and chunking is…
master_dodo
  • 1,203
  • 3
  • 20
  • 31
1
2
3
9 10