我正在尝试通过外部加载程序使用 Next.js 图像优化。我不知道为什么以下不起作用
module.exports = withPlugins([withGraphql], {
[PHASE_PRODUCTION_BUILD]: {
webpack: (config, { webpack }) => {
config.plugins.push(new webpack.IgnorePlugin(/\/__tests__\//))
return config
},
},
images = {
loader: 'imgix',
path: process.env.IMAGE_LOADER_URL,
}
})
但是如果我对值进行硬编码，它就会起作用。这是在 Heroku 上并记录 process.env.IMAGE_LOADER_URL 的值显示在日志中。
答案 0 :(得分：0)
所以这是双重的：
import React from 'react';
import { ImageBackground,Image,ActivityIndicator, TouchableOpacity, StyleSheet, Text, View,TextInput,Dimensions } from 'react-native';
import background from "../Images/background.jpg";
import independoLogo from "../Images/Independo.png";
import firebase from 'firebase/app';
require('firebase/auth')
require('firebase/firestore')
const {width : WIDTH } = Dimensions.get('window')
const screenHeight=Dimensions.get('window').height
const screenWidth=Dimensions.get('window').width
class LoginAdult extends React.Component {
constructor(props){
super(props)
this.state={
email:'',
password:'',
isLoading:false,
}
this.checkStatusLogin=this.checkStatusLogin.bind(this);
}
checkStatusLogin(status)
{
alert("The user logged in");
console.log("checkStatus = ",status);
if(status==="Parent")
{
console.log("checkStatusParent = ",status);
this.props.navigation.navigate("HomeParent");
}
if(status==="Teacher")
{
console.log("checkStatusTeacher = ",status);
this.props.navigation.navigate("HomeTeacher");
}
if(status==="Child")
{
console.log("checkStatusTeacher = ",status);
this.props.navigation.navigate("HomeChild");
}
}
LoginPress= async()=>{
const {email,password,}=this.state;
global.stat;
if(this.state.email && this.state.password)
{
await firebase.auth().signInWithEmailAndPassword(email,password)
.then(firebase.auth().onAuthStateChanged(function(user)
{
if (user != null)
{
var docRef=firebase.firestore().collection("Users").doc(user.uid);
docRef.get().then((doc) => {
if (doc.exists) {
console.log("Document data:", doc.data());
const {status} = doc.data();
console.log("Status = ",status);
this.checkStatusLogin(status);
} else {
console.log("No such document!");
}
}).catch((error) => {
console.log("Error getting document:", error);
});
}
}))
.catch((error)=>{
switch(error.code)
{
case 'auth/invalid-email':
alert("Please, enter a valid mail")
break;
case 'auth/user-not-found':
alert('A user with this email doesnt exist, please sign Up')
break;
}
}
)
}
else{
alert("Please enter email and password!")
}
}
render(){
return (
<ImageBackground source={background} style={styles.imagebackground}>
<View style={{header:25,backgroundColor:"",alignItems:'center',marginTop:40}}>
<Image source={independoLogo} style={styles.logo}/>
</View>
<View style={{flex:1,borderWidth:0,borderColor:'transparent',margin:40,marginTop:0,marginBottom:220}}>
{this.state.isLoading?
<View style={{alignItems:'center',justifyContent:'center',zIndex:1000,elevation:1000}}>
<ActivityIndicator size="large" color="black"/>
</View>
:null}
<View style={{flex:1,backgroundColor:"#F9f3fc",alignItems:'center',paddingTop:35,borderRadius:15,borderStyle:'dotted solid double'}}>
<Text style={{fontWeight:'bold',fontSize:30,paddingBottom:30}}>LOGIN</Text>
<TextInput
style={styles.input}
placeholderTextColor={'black'}
placeholder={'Email'}
onChangeText={inputEmail=>this.setState({email:inputEmail})}/>
<TextInput
style={styles.input}
placeholderTextColor={'black'}
placeholder={'Password'}
secureTextEntry={true}
onChangeText={inputPassword=>this.setState({password:inputPassword})}/>
<TouchableOpacity style={styles.btnLogin} onPress={()=>this.LoginPress()}>
<Text style={{fontWeight:'600'}}>Login</Text>
</TouchableOpacity>
<TouchableOpacity
style={{alignItems:'center',flexDirection:'row'}}
onPress={()=>this.props.navigation.navigate("SignUp")}>
<Text>Dont have an account? </Text>
<Text style={styles.text}>Sign Up</Text>
</TouchableOpacity>
<TouchableOpacity
style={{alignItems:'center',flexDirection:'row',margin:4}}
onPress={()=>this.props.navigation.navigate("ForgotPasswordAdult")}>
<Text style={{textDecorationLine:'underline' ,fontSize:16 ,fontWeight:'bold',}}>
Forgot Password?
</Text>
</TouchableOpacity>
</View>
</View>
</ImageBackground>
);
}
}
export default LoginAdult;
const styles = StyleSheet.create({
});
文件之前读取此文件。.env。最终我的解决方案是放弃 Dockerized 构建。这也提高了我的部署速度。