我的这个应用程序的更新版本为node_modules
,其中注册失败,但其他所有功能都正常。我将旧版本的node_modules
替换为旧版本的备份。它开始工作。我还将其部署在netlify
上。因此,当我运行npm run build
并手动将构建文件夹上载到netlify
时,它可以工作,但是当我尝试从github进行部署时,注册再次失败。
我尝试用旧的替换package.json,然后运行npm install
,但这也不起作用。
注册代码
import { Link, withRouter } from "react-router-dom";
import { Redirect } from "react-router";
import PasswordMask from "react-password-mask";
import {
withFirebase,
firebase,
FirebaseContext,
db
} from "../../../Components/Firebase/firebase";
import * as ROUTES from "../../../Constants/routes";
import { compose } from "recompose";
import PhyxData from "../../../Constants/phyxData.js";
import "./styles.css";
const DemoSignUpPage = () => (
<div>
<img
src="/images/demoOnePage/group.png"
className="demo-page-one-illustration dp-signup"
/>
<div
className="lead-text margin-top-40 demo-signup"
>
Thanks for trying Phyxable!
<br />
Let's continue the healing process.
</div>
<div className="center margin-top-16">
<div className="inline-block">
<DemoSignUpForm />
</div>
</div>
</div>
);
const INITIAL_STATE = {
username: "",
email: "",
passwordOne: "",
passwordTwo: "",
error: null
};
class DemoSignUpFormBase extends Component {
constructor(props) {
super(props);
this.state = { ...INITIAL_STATE, redirect: false };
}
onSubmit = event => {
console.log("sign up submit called", this.props);
const { username, email, passwordOne } = this.state;
this.props.firebase
.doCreateUserWithEmailAndPassword(email, passwordOne)
.then(authUser => {
console.log("sign up submit called 2");
return this.props.firebase.user(authUser.uid).update({
joinDate: new Date().toLocaleDateString("en-US"),
userProfile: {
lastPhyx: { date: new Date(), level: 1, session: 1 },
subscription: { paid: false },
progress: {
posture: {
1: { 0: { date: new Date().toLocaleDateString("en-US") } }
}
},
name: username,
email: email,
score: {
feelingGood: 1,
lastDate: new Date().toLocaleDateString("en-US"),
longestStreak: 1,
streak: 1,
totalTime: 2
},
VAS: {},
currentPhyx: "posture",
accountType: "USER",
notification: {},
signedIn: false
}
});
})
.then(authUser => {
console.log("in on submit sign up");
this.setState({ ...INITIAL_STATE });
this.setState({ redirect: true });
})
.catch(error => {
this.setState({ error });
});
event.preventDefault();
};
onChange = event => {
this.setState({ [event.target.name]: event.target.value });
};
handleTryFirstClick = () => {
this.setState({ redirect: true });
};
render() {
console.log("demo sign up", this.props);
if (this.state.redirect) {
// return <Redirect push to="/home" />;
window.location.href = "/home";
}
const { username, email, passwordOne, passwordTwo, error } = this.state;
const isInvalid =
// passwordOne !== passwordTwo ||
passwordOne === "" || email === "" || username === "";
return (
<form className="margin-top-16">
<div className="center">
<div className="inline-block">
<input
name="username"
value={username}
onChange={this.onChange}
type="text"
placeholder="Full Name"
/>
<div className="height-8" />
<input
name="email"
value={email}
onChange={this.onChange}
type="text"
placeholder="Email Address"
/>
<div className="height-8" />
<PasswordMask
id="password"
name="passwordOne"
value={passwordOne}
onChange={this.onChange}
type="password"
placeholder="Password"
inputStyles={{
padding: "8px",
fontSize: "16px"
}}
inputClassName="PasswordMaskInput"
buttonStyles={{
width: "61px"
}}
/>
{/* <PasswordMask
name="passwordTwo"
value={passwordTwo}
onChange={this.onChange}
type="password"
placeholder="Confirm Password"
inputStyles={{
padding: "8px",
fontSize: "16px"
}}
inputClassName="PasswordMaskInput"
buttonStyles={{
width: "61px"
}}
/> */}
</div>
</div>
<div className="margin-top-40">
<button
onClick={event => {
this.onSubmit(event);
}}
disabled={isInvalid}
type="submit"
>
Sign Up
</button>
</div>
{error && <p>{error.message}</p>}
</form>
);
}
}
const DemoSignUpForm = compose(
withRouter,
withFirebase
)(DemoSignUpFormBase);
export default DemoSignUpPage;
export { DemoSignUpForm };
这是我的package.json
:
{
"name": "finalphyx",
"version": "0.1.0",
"private": true,
"dependencies": {
"@material-ui/lab": "^3.0.0-alpha.30",
"disable-scroll": "^0.4.1",
"firebase": "^6.1.1",
"firebase-functions": "^2.3.1",
"html-loader": "^0.5.5",
"mdbreact": "^4.15.0",
"netlify": "^2.4.6",
"react": "^16.7.0",
"react-bootstrap": "^0.32.4",
"react-div-100vh": "^0.3.4",
"react-dom": "^16.7.0",
"react-firebaseui": "^3.1.2",
"react-ga": "^2.5.7",
"react-jw-player": "^1.19.0",
"react-meta-tags": "^0.7.4",
"react-password-mask": "^3.3.1",
"react-player": "^1.11.0",
"react-responsive": "^7.0.0",
"react-router-dom": "^5.0.1",
"react-scripts": "^3.0.1",
"react-scroll": "^1.7.11",
"react-share": "^3.0.0",
"react-stripe-checkout": "^2.6.3",
"react-stripe-elements": "^3.0.0",
"react-sweet-progress": "^1.1.2",
"recompose": "^0.30.0",
"stripe": "^7.1.0",
"video-react": "^0.13.7",
"waypoints": "^4.0.1",
"window-scroll-manager": "^1.1.4"
},
"devDependencies": {
"bundle-loader": "^0.5.6",
"prettier": "^1.18.2",
"pretty-quick": "^1.11.0",
"aws-sdk": "^2.1.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build && echo '/* /index.html 200' > build/_redirects",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"deploy": "aws s3 sync build s3://www.phyxable.com"
},
"main": "index.js",
"repository": {
"type": "git",
"url": "git+https://jacobmjones@bitbucket.org/jacobmjones/web.git"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
],
"homepage": "/",
"author": "",
"license": "ISC",
"description": ""
}
答案 0 :(得分:0)
如果问题与您所描述的完全一样,那么显然这不是代码问题,而是依赖项。请注意,如果您的代码适用于某些版本,那么它可能也不适用于其他版本(无论是升级还是降级)。
我要尝试的第一件事是获取旧程序包json,并使用它进行清晰的安装(在备份需要执行的操作后,清除节点缓存并完全删除node_modules文件夹)。如果它很酷,如果不是,那么您的依赖项中的一个更改本来应该是次要的,但却是一个重大更改(这导致您的代码停止工作)
现在通常是因为新版本(即使不是本应具有重大更改的版本)也可能导致重大更改,因此npm创建了一个名为package-lock.json的文件。与package.json不同,此版本包含在特定安装过程中使用的确切版本,并且使用该软件包文件安装节点模块时,应准确反映当时依赖关系的状态。
如果您拥有该锁文件并使用npm ci-进行安装,则它应该可以工作。