reactjs config.js如何读取配置JSON

问题描述

所以我试图设置一个全局配置文件。这样我就可以设置全局站点网址（表单等）。

{
site:"example.com"
}

我正在使用

const config = Require("config");

我正在尝试将其放入返回函数中

export default function SignInSide() {
  const classes = useStyles();

  return ( <form action="{config.site}/users/login" method="POST" className={classes.form} novalidate>
            <TextField
              variant="outlined"
              margin="normal"
              required
              fullWidth
              id="email"
              label="Email Address"
              name="email"
              autoComplete="email"
              autoFocus
            />
            <TextField
              variant="outlined"
              margin="normal"
              required
              fullWidth
              name="password"
              label="Password"
              type="password"
              id="password"
              autoComplete="current-password"
            />
            <FormControlLabel
              control={<CheckBox value="remember" color="primary" />}
              label="Remember me"
            />
            <Button
              type="submit"
              fullWidth
              variant="contained"
              color="primary"
              className={classes.submit}
            >
              Sign In
            </Button>
            <Grid container>
              <Grid item xs>
                <Link href="#" variant="body2">
                  Forgot password?
                </Link>
              </Grid>
              <Grid item>
                <Link href="#" variant="body2">
                  {"Don't have an account? Sign Up"}
                </Link>
              </Grid>
            </Grid>
            <Box mt={5}>
              <copyright />
            </Box>
          </form>)

}

我想知道如何阅读{config.site}

解决方法

我认为您可以通过以下示例实现此目标：

import * as config from './config.json'
console.log(config.site)

edit：typo

您可以拥有一个名为global.config.js的配置文件

export const Properties = {
    site : "example.com",...
}

可以使用导入时

import { Properties } from 'global.config'; // PATH TO CONFIG FILE

向您提出新问题，

<form action=`http://${Properties.site)/users/login`>
// Your logic goes here...

reactjs reactjs