如何在docker文件中获取docker环境变量? (使用React / JS / webpack)

时间:2018-05-09 14:50:00

标签: javascript reactjs docker webpack dokku

dockerfile:

ARG MY_VAR

ENV NODE_ENV  production
ENV MY_VAR $MY_VAR

COPY . .

RUN NODE_ENV=development npm install && \
    touch ./.env && \
    eval env > ./.env && \
    npm run build && \
    npm prune --production

Docker newb here

在我的容器中,我运行env命令并查看我设置的变量,同样在运行节点控制台时我可以看到它们已设置在process.env

但是当我的项目构建时,我的所有env变量都是未定义的(在RUN命令期间它们不可用)

eval env > ./.env &&行将我使用ENV命令设置的变量放入.env,但我不能在dockerfile中对这些变量进行硬编码

我希望我可以做类似的事情:

ENV MY_VAR $process.env.MY_VAR

是否有类似的东西来获取我的环境变量?

编辑:

webpack.config.js:

require('dotenv').config()

const webpack = require("webpack");
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");

const BUILD_PATH = path.resolve(__dirname, "./client/build") + '/';
const SOURCE_PATH = path.resolve(__dirname, "./client/src") + '/';
const PUBLIC_PATH = path.resolve(__dirname, "./client/build") + '/';

const env = require('./env')(PUBLIC_PATH)


module.exports = () => {
  return {
    entry: ["idempotent-babel-polyfill", SOURCE_PATH + "/index.jsx"],

    context: SOURCE_PATH,

    output: {
      path: BUILD_PATH,
      filename: "bundle.js",
      publicPath: PUBLIC_PATH
    },

    module: {
      rules: [
        {
          test: /\.jsx?$/,
          exclude: /node_modules/,
          use: [
            { loader: "babel-loader" },
          ]
        },
        {
          test: /\.scss$/,
          exclude: /node_modules/,
          use: [
            { loader: "style-loader" },
            { loader: "css-loader" },
            { loader: "sass-loader" }
          ]
        },
        {
          test: /\.(png|jpg|gif)$/,
          exclude: /node_modules/,
          use: [
            { loader: "file-loader" }
          ]
        }
      ]
    },

    devServer: {
      compress: true,
      port: 3002,
      historyApiFallback: true,
      contentBase: BUILD_PATH,
      publicPath: PUBLIC_PATH
    },

    devtool: "eval-source-map",

    plugins: [
      new webpack.DefinePlugin(env),
      new HtmlWebpackPlugin({
        filename: "index.html",
        template: path.resolve(SOURCE_PATH + "/index.html"),
        inject: true
      }),
      new webpack.optimize.UglifyJsPlugin(),
    ],

    watch: false,

  }
};

env.js:

require('dotenv').config()

// Grab NODE_ENV and REACT_APP_* environment variables and prepare them to be
// injected into the application via DefinePlugin in Webpack configuration.
var REACT_APP = /^REACT_APP_/i;

function getClientEnvironment(publicUrl) {
  var processEnv = Object
    .keys(process.env)
    .filter(key => REACT_APP.test(key))
    .reduce((env, key) => {
      env[key] = process.env[key];
      return env;
    }, {
        'NODE_ENV': process.env.NODE_ENV || 'development',
        'MY_VAR': process.env.MY_VAR // for example
      });

  processEnv['process.env'] = Object
    .keys(processEnv)
    .reduce((env, key) => {
      env[key] = JSON.stringify(processEnv[key]);
      return env;
    }, {})

  return processEnv;
}

module.exports = getClientEnvironment;

1 个答案:

答案 0 :(得分:0)

在docker的CMD语句中执行构建命令解决了这个问题