Can't load node_modules/@react-page/editor/lib-es/core/Provider/CallbacksProvider.js, file missing
GiambaFr opened this issue · comments
GiambaFr commented
Describe the bug
Can't load node_modules/@react-page/editor/lib-es/core/Provider/CallbacksProvider.js, file missing.
log:
oadable-components: failed to asynchronously load component ObjectchunkName: undefinederror: "Loading chunk vendors-node_modules_react-page_editor_lib-es_editor_EditableEditor_js failed.\n(missing: http://facture.local/build/vendors-node_modules_react-page_editor_lib-es_editor_EditableEditor_js.js)"fileName: undefined[[Prototype]]: Object
(anonymous) @ loadable.esm.js:146
loadable.esm.js:377 Uncaught ChunkLoadError: Loading chunk vendors-node_modules_react-page_editor_lib-es_editor_EditableEditor_js failed.
(missing: http://facture.local/build/vendors-node_modules_react-page_editor_lib-es_editor_EditableEditor_js.js)
at __webpack_require__.f.j (jsonp chunk loading:27:1)
at ensure chunk:6:1
at Array.reduce (<anonymous>)
Uncaught (in promise) ChunkLoadError: Loading chunk vendors-node_modules_react-page_editor_lib-es_editor_EditableEditor_js failed.
(missing: http://facture.local/build/vendors-node_modules_react-page_editor_lib-es_editor_EditableEditor_js.js)
at __webpack_require__.f.j (jsonp chunk loading:27:1)
The app crash.
To Reproduce
Symfony 5.4, Webpack 5, MUI 5, React_Page Beta, file created with 'yarn encore dev'
The code
import React, {Component} from 'react';
import { withStyles } from '@mui/styles';
import axios from 'axios';
import CircularProgress from '@mui/material/CircularProgress';
import RefreshIcon from '@mui/icons-material/Refresh';
import SaveIcon from '@mui/icons-material/Save';
import Button from '@mui/material/Button';
import '@react-page/editor/lib/index.css';
//import type { Value } from '@react-page/editor';
import Editor from '@react-page/editor';
// The rich text area plugin
import slate from '@react-page/plugins-slate';
// image
import image from '@react-page/plugins-image';
// Stylesheets for the rich text area plugin
import '@react-page/plugins-slate/lib/index.css';
//Stylesheets for the imagea plugin
import '@react-page/plugins-image/lib/index.css';
class CMS extends Component {
static defaultProps = {
pageId: null
}
state= {
page: {
name: null,
path: null,
templatePath: null,
isIndex: false,
content: null
},
loadingPage: true,
}
loadPage = () => {
const { pageId } = this.props;
this.setState({loadingPage: true});
self = this;
axios.get('api/page/'+pageId)
.then(response => {
console.log(response);
return response.data;
}).then( data => {
console.log(data);
const page = data.page;
self.setState({ page: page, loadingPage: false });
})
.catch(function (error) {
console.log(error);
self.setState({ loadingPage: false });
})
}
componentDidMount() {
this.loadPage();
}
refreshPage = () => {
this.loadPage();
}
handleChange = (event) => {
this.setState({[event.target.name]: event.target.value});
}
handleSubmit = (event) => {
alert('Le nom a été soumis : ' + this.state.page.name);
event.preventDefault();
}
render() {
const { page, loadingPage } = this.state
return(
<div>
<Button variant="text" onClick={this.refreshPage}><RefreshIcon/></Button>
<Button variant="text" onClick={this.save}><SaveIcon/></Button>
{loadingPage && <CircularProgress/>}
{page.name &&
<form onSubmit={this.handleSubmit}>
<label>
Nom :
<input name="name" type="text" value={page.name} onChange={this.handleChange} />
</label>
<label>
Url :
<input name="path" type="text" value={page.path} onChange={this.handleChange} />
</label>
<label>
Template :
<input name="templatePath" type="text" value={page.templatePath} onChange={this.handleChange} />
</label>
<label>
Page d'accueil :
<input name="isIndex" type="text" value={page.isIndex} onChange={this.handleChange} />
</label>
<label>
Contenu :
<div>
<Editor cellPlugins={[slate(), image]} />
</div>
</label>
<input type="submit" value="Envoyer" />
</form>
}
</div>
)
}
}
const styles = theme => ({
root: {
height: 240,
flexGrow: 1,
maxWidth: 400,
overflowY: 'auto'
},
});
export default withStyles(styles, {withTheme: true})(CMS);
Expected behavior
See the editor in the app
Screenshots
If applicable, add screenshots to help explain your problem.
Desktop (please complete the following information):
- Chrome 103, Win 10, apache2 on unbuntu
Additional context
No typeScript
The file is loaded but not parsed
GiambaFr commented
Not a bug, I have to use typeScript.