reactjs - 我的 React 应用程序正在使用 .env 文件中的值而不是 .env.local 文件

标签 reactjs create-react-app dotenv craco

dotenv模块should be优先考虑我的 .env.local文件在我的 .env文件,但它不是。当我有 REACT_APP_API_BASE在这两个文件中设置,应用程序始终使用 .env 中的值.它只使用 .env.local 中的值如果我删除 .env 中的匹配定义.

.env

REACT_APP_API_BASE = 'https://api-staging.mysite.com/api'

.env.local
REACT_APP_API_BASE = 'https://api-qa.mysite.com/api'

该应用程序正在向 https://api-staging.mysite.com/api/endpoint. 发出 API 调用
我究竟做错了什么?
作为引用,我没有运行 react-scripts直接,我正在使用 CRACO。
package.json
  "scripts": {
    "start": "craco start",
    "build": "craco build"
  },
  "dependencies": {
    "@craco/craco": "^6.0.0",
    "@material-ui/core": "^4.11.2",
    "@material-ui/icons": "^4.11.2",
    "@material-ui/lab": "^4.0.0-alpha.57",
    "@sentry/react": "^6.2.2",
    "@sentry/tracing": "^6.2.2",
    "@sentry/webpack-plugin": "^1.14.0",
    "@stripe/react-stripe-js": "^1.3.0",
    "@stripe/stripe-js": "^1.13.0",
    "mixpanel-browser": "^2.41.0",
    "react": "^16.6.0",
    "react-dom": "^16.0.0",
    "react-gtm-module": "^2.0.11",
    "react-intl": "^5.10.14",
    "react-router-dom": "^5.2.0",
    "react-scripts": "4.0.1",
    "typescript": "^4.1.3",
    "universal-cookie": "^4.0.4",
    "web-vitals": "^0.2.4"
  },
  "devDependencies": {
    "@formatjs/cli": "^3.0.1",
    "@storybook/addon-a11y": "^6.1.20",
    "@storybook/addon-actions": "^6.1.20",
    "@storybook/addon-essentials": "^6.1.20",
    "@storybook/addon-links": "^6.1.20",
    "@storybook/components": "^6.1.20",
    "@storybook/node-logger": "^6.1.20",
    "@storybook/preset-create-react-app": "^3.1.5",
    "@storybook/react": "^6.1.18",
    "@testing-library/jest-dom": "^5.11.9",
    "@testing-library/react": "^11.2.5",
    "@testing-library/user-event": "^12.8.3",
    "@types/jest": "^26.0.20",
    "@types/mixpanel-browser": "^2.35.6",
    "@types/node": "^14.14.20",
    "@types/react": "^17.0.0",
    "@types/react-dom": "^17.0.0",
    "@types/react-gtm-module": "^2.0.0",
    "@types/react-router-dom": "^5.1.7",
    "babel-plugin-formatjs": "^9.0.1",
    "babel-plugin-import": "^1.13.3",
    "dotenv-webpack": "^1.8.0",
    "eslint-plugin-sonarjs": "^0.5.0",
    "hint": "^6.1.1",
    "jest-chain": "^1.1.5",
    "react-test-renderer": "^17.0.1"
  },
  "babel": {
    "presets": [
      "react-app"
    ],
    "plugins": [
      [
        "formatjs",
        {
          "idInterpolationPattern": "[sha512:contenthash:base64:6]",
          "ast": true
        }
      ]
    ]
  },

最佳答案

发布赏金五分钟后,我终于弄明白了......
我的一个文件有 require('dotenv').config();在顶部。显然,这是用主 .env 中的任何内容覆盖了 CRA 发现的配置。文件。曾经我从我的代码中删除了该行 ,一切正常。

关于reactjs - 我的 React 应用程序正在使用 .env 文件中的值而不是 .env.local 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/66467244/

相关文章:

javascript - NestJS 环境变量未定义

javascript - 路由器不导航到下一页,但 url 发生变化

node.js - 当我运行 npm start 创建 React 应用程序时缺少脚本

javascript - create-react-app 在构建时排除/包含/更改代码部分

reactjs - process.env.NODE_ENV === "developement"即使在生产中

node.js - 将 dotenv 路径与 JEST 一起使用

node.js - 转义 .env 文件中的 # 字符

javascript - 如何在公共(public)标题下嵌套组件

css - 我正在使用 webpack 使用 React js 和 jsx 和 css,当我将图像添加到 css 时,我的代码无法编译

reactjs - 如何告诉 react-create-app 构建脚本不要最小化文件的某些部分?