`process.env` Object in config.js empty on Browser
JaesungNa opened this issue · comments
From the code below(config.js
), it seems like it intends to export environment variables, in order it to be made available on client side.
const merge = require('lodash/merge')
const config = {
all: {
env: process.env.NODE_ENV || 'development',
isDev: process.env.NODE_ENV !== 'production',
basename: process.env.PUBLIC_PATH,
isBrowser: typeof window !== 'undefined',
},
test: {},
development: {},
production: {},
}
module.exports = merge(config.all, config[config.all.env])
However, on browser, process.env
object is empty, which means config.all.env
will always assign fallback constant('development'
).
So, I am not sure why do we need such configuration setting. (if I went wrong, pls point me out)
//logged `process` object
{
"title": "browser",
"browser": true,
"env": {},
"argv": [],
"version": "",
"versions": {}
}
Furthermore, it seems like we were able to refer proccess
object on browser, as we have stated out process
related constants on DefinedPlugin
on webpack.config.js
as below; Node process object made available to browser client code.
But, with Webpack 5, process
object is no longer referable on browser. So any code trying to refer to process
object on browser leads to uncaughtReference. process is not defined
error.
new webpack.DefinePlugin({
NODE_ENV: process.env.NODE_ENV,
PUBLIC_PATH: publicPath.replace(/\/$/, ''),
}),
Is there something that I missed out from the code? or else we could fetch this thing out! :)