Questions tagged [react-loadable]
137 questions
1
vote
1 answer
React redux + react-loadable... How to make it work?
I'm working in a react app and I'm using react-loadable and react-redux. When I started the project, I did not use react-redux and the Loadable component worked perfect. But now I want to use redux (I'm learning...) and I can not get it to work :(
I…
Alejandroid
- 199
- 1
- 14
1
vote
0 answers
Using react-loadable to set up routes for components
I'm trying to use react-loadable to dynamically import components.
I've a config file like this:
Manifest.ts
export let manifest = {
apps: [
{
componentPath: "/Test/App",
path: "/test",
name: "Test"
},
...more objects…
clever_bassi
- 2,392
- 2
- 24
- 43
1
vote
1 answer
Code splitting and dynamic loading in Webpack 4 with react loadable
So I have a webpack 4 react app that has 2 parts:
Login component
Rest of the app
My routes.js looks like this:
import React from 'react';
import Home from 'Home';
....
const LoadableLoginComponent = Loadable({
loader: () =>…
prgrmr
- 842
- 3
- 14
- 30
1
vote
1 answer
Route-based code splitting chunks are not found after building the app only for deeper routes
I'm building a React App using create-react-app, and now I'm struggling with code splitting in it. I'm using react-loadable. Everything was fine in the development environment, but when it's built some chunks on some deeper routes (e.g. /test/2 or…
1
vote
1 answer
react-loadable component does not wait trigger to load
This is a basic header component that includes buttons to show login/register forms on click.
The intention is, of course, that the login and register components shouldn't be loaded until requested.
react-loadable is creating an additional file (…
BernardA
- 1,391
- 19
- 48
1
vote
1 answer
What wrong with delay property in react-loadable?
I'm using react-loadable library for lazy-loading in reactJS. It works very well for rendering component. But when i use the delay property, the render time is not effected. So, What i need to update here ?
const Home = Loadable({
loader: () =>…
stevenH
- 155
- 3
- 13
1
vote
1 answer
Exclude unused dynamic modules from bundle using react-loadable
I've got an issue with react-loadable where I've got a large list of components that may or may not be rendered depending on user-generated content. I'm using a switch statement to render the correct ones.
A (simplified) list of user-generated…
James P
- 718
- 6
- 14
1
vote
2 answers
How to redirect login page to dashboard using ReactJS?
I want when I submit the email and the password to login, it will be redirected to the dashboard, my code is below :
handleClick(event){
var payload={
"email":this.state.email,
"password":this.state.password
}
…
Ichrak Mansour
- 1,850
- 11
- 34
- 61
1
vote
1 answer
Issue importing external modules from component included with react-loadable
I've a component loaded using react-loadable (5.4.0) that also loads some other local and external libraries:
import { validationAPI, docstringAPI, autocompleteAPI } from 'utils/request';
import something from './something';
import CodeMirror from…
keul
- 7,673
- 20
- 45
1
vote
1 answer
react CRA - exclude debug code from build
Is there any method to completely exclude some code from if statements in production mode??
I was trying to do something like that:
import React from "react";
import Loadable from 'react-loadable';
function Loading() {
return ;
}
let…
Ponciusz
- 147
- 3
- 18
1
vote
0 answers
How can I export various components from a library using react-loadable
I want to achieve something like this:
Loadable({
loader: () => import('react-bootstrap')
})
and then I want to export specific components inside that like Grid, Row, Col that are usually imported as follows:
import { Grid, Row, Col } from…
ayush
- 11
- 2
1
vote
1 answer
react-loadable.json with mini css plugin return undefined on styles
I am currently trying to code split for react server side rendering.
Everything works fine except the refreshing part. When I refresh the page, Everything shows in server side. However, the split second right before client side takes over the lazy…
fiddlest
- 1,262
- 2
- 17
- 42
1
vote
0 answers
importing images doesn't work properly in react + parcel + typescript + module esnext
Reproductive example repo
module_esnext_import_image
How to reproduce
git clone https://github.com/github0013/module_esnext_import_image.git
cd module_esnext_import_image
yarn
yarn run src/index.html
then, look inside the dist folder. You should…
kukrt
- 2,117
- 3
- 21
- 32
1
vote
1 answer
React-Loadable re-rendering causing input to lose focus
I'm having an issue where react-loadable is causing one of my input components to re-render and lose focus after a state update. I've done some digging and I can't find anyone else having this issue, so I think that I'm missing something here.
I am…
NoxelNyx
- 995
- 1
- 7
- 21
1
vote
1 answer
Code splitting route components wrapped in a HOC with React Loadable
I am running into problems using React Loadable with route based code splitting using Webpack 3.11.
When I try to render my app on the server my async modules immediately resolve without waiting for the promise. Thus the SSR output becomes
Squrler
- 3,444
- 8
- 41
- 62