时间戳

首页 > 解决方案 > 是否可以使用 reactjs CRA 为不同的环境渲染不同的 html

javascript - 是否可以使用 reactjs CRA 为不同的环境渲染不同的 html

问题描述

Create React App 生成一个我们用来绑定组件的静态 html。我想知道我们是否可以根据我们所处的环境更改内容。

<!DOCTYPE html>
<html lang="en">
  <head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
  <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
  <title>React App</title>
</head>
<body>
  <div id="root"></div>
</body>

例如，如果我可以根据反应应用程序的运行位置将标题设置为"develop"& ？"production"

这可以仅使用 reactjs env 配置文件来实现，而无需任何服务器端渲染吗？

编辑： ...并且没有弹出和处理 webpack 配置？

标签： javascriptreactjsenvironment-variablescreate-react-app

解决方案

我有一个解决方案，可以在不使用环境变量的情况下完成，假设您的开发和生产 url 不同

您可以从该 url 获取当前 url，window.location.href您可以根据该 url 更改 react 应用程序的标题。

但是，我觉得环境变量会是一个更好的解决方案

推荐阅读