带有 React Webpack 的 Ruby on Rails - 定义/访问环境变量？

Question

我创建了一个使用 Rails 和 React 前端的应用程序 (rails new my-app --webpack=react)

我以前曾单独使用过 Rails 和 React，但从未以这种方式集成过。

由于该应用程序在 rails s 上提供服务，我的理解是这本质上是作为一个渲染 React 组件的 rails 应用程序工作的，所以我相信环境变量将在 config/application.yml 中定义，而不是在 @ 987654327@，但我都尝试过，但无法在 React 组件中访问它们

我尝试过的

• .env 中的变量和 application.yml

• dotenv-webpack

• webpack DefinePlugin

• adding my env files in config/webpack/environment.js

• 以 REACT_APP 为前缀

• 将变量硬编码到 webpack 配置中

我正在运行rails server 和 ./bin/webpack-dev-server，并在启动服务器之前运行"webpack --config webpack.config.js"。

我的 webpack.config.js

const Dotenv = require('dotenv-webpack');
const webpack = require('webpack');
const path = require('path');


module.exports = {
  entry: path.resolve(__dirname, '') + '/app/javascript/packs/index.jsx',
  plugins: [
    new Dotenv(),
    new webpack.DefinePlugin({
      PRODUCTION: JSON.stringify(true),
      VERSION: JSON.stringify('5fa3b9'),
      BROWSER_SUPPORTS_HTML5: true,
      TWO: '1+1',
      'typeof window': JSON.stringify('object'),
      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
      'process.env.REACT_APP_LAST_FM_API_KEY': JSON.stringify('myApiKeyfs89fs08a0')
    })
  ],
    module: {
    rules: [
      { test: /\.jsx$/, use: {loader:'babel-loader'} },
      { test: /\.js$/, use: {loader:'babel-loader'} }
    ]
  },
  node: {fs:"empty"},
  output: {
    publicPath: '/'
  }
};

Answer 1

最后，我不需要做任何以上的事情。我只需要 .env 文件并添加

const dotenv = require('dotenv')
dotenv.config()

致我的config/webpack/development.js