I'm building a React library and using "rollup" npm package to bundle my source into ES-6 to be published to NPM registry. In my source I import a PrimReact component
import { Button } from "primereact/components/button/Button";
for some reason, because I reference a PrimeReact library, the generated ES-6 code contains these "commonjs-proxy" which cause problem at runtime as it can't find the "commonjs-proxy" module.
import _propTypes from ' commonjs-proxy:prop-types';
import _classnames from ' commonjs-proxy:classnames';
Does anyone know why PrimeReact would be using these commonjs-proxy proptypes and classnames?
Thanks in advance.
React component using PrimeReact
Trying to update the value for Editor but its just not working i am not sure i am doing or it is bug wii
Code: Select all
import React, { Component } from "react";
import { Editor } from "primereact/editor";
import { Button } from "primereact/button";
import {InputTextarea} from 'primereact/inputtextarea';
export default class Note extends Component {
state = {}
componentDidUpdate = (prevProps) => {
// Typical usage (don't forget to compare props):
if (this.props.note.title !== prevProps.note.title) {
this.setState({...this.props.note});
setTimeout(() => {
this.setState({body : 'your stuff'})
}, 1000)
}
}
onChange =(e) =>{
this.setState({[e.target.name] : e.target.value})
}
getNote() {
if (this.props.editMode === "read") {
return (
<div>
<h1>{this.props.note.title}</h1>
<hr />
<div>{this.props.note.body}</div>
</div>
);
} else
return (
<form>
<input
type="text"
style={{
width: "100%",
fontWeight: "bold",
height: "30px",
paddingLeft: "5px"
}}
name="title"
value={this.state.title}
onChange={this.onChange}
/>
<Editor style={{ height: "600px" }}
value={this.state.body}
key="body"
name="body"
onTextChange={(e)=> this.setState({body : e.htmlValue})} />
<br />
{/* <InputTextarea value={this.state.body} style={{width:"100%" , height:"600px"}}
name="body" onChange={this.onChange} /> */}
<Button label="Clear" icon="pi pi-times" onClick={(e)=> {e.preventDefault(); this.setState({body:''})}}/>
</form>
);
}
render() {
return (
<div className="noteContainer" style={{ background: "#f1f1f1" }}>
<div id="presentation">
{this.getNote()}
</div>
<div id="container-floating">
<div
id="floating-button"
data-toggle="tooltip"
data-placement="left"
data-original-title="Create"
>
<p className="plus">+</p>
<img
className="edit"
src="https://ssl.gstatic.com/bt/C3341AA7A1A076756462EE2E5CD71C11/1x/bt_compose2_1x.png"
/>
</div>
</div>
</div>
);
}
}
-
- Information
-
Who is online
Users browsing this forum: No registered users and 26 guests