dotenv-webpack: Failed to load ./.env.
Hello,
When webpack build is runing it prints Failed to load ./.env. dotenv-webpack version : ^1.5.5 I do server side rendering with react and my webpack for server is
const path = require('path');
const webpackNodeExternals = require('webpack-node-externals');
const webpack = require('webpack');
const Dotenv = require('dotenv-webpack');
const webpackConfig = {
target: 'node',
node: {
__dirname: false,
__filename: false,
},
devtool: 'sourcemap',
entry: path.resolve(__dirname, '../../src/server/express.js'),
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, '../../src/server/build')
},
externals: [webpackNodeExternals()],
module: {
rules: [
{
test: /(\.js|\.jsx)?$/,
loader: 'babel-loader',
exclude: /node_modules/,
options: {
presets: [
'react',
'stage-0',
'env',
],
plugins: ['transform-runtime', 'transform-class-properties', "transform-react-jsx"]
}
},
{
test: /\.css$/,
use: [
{
loader: 'isomorphic-style-loader',
},
{
loader: 'css-loader',
options: {
modules: true,
importLoaders: 1,
localIdentName: '[name]__[local]___[hash:base64:5]',
}
}
]
},
{
test: /\.(png|jpg|svg)$/,
use: [
{
loader: 'file-loader',
options: {
name: '[name].[ext]',
outputPath: '/public/images',
publicPath: '/images',
emitFile: false
}
}
]
}
]
},
resolve: {
extensions: ['.js', '.jsx']
},
plugins: [
new Dotenv({
path: './.env'
}),
new webpack.BannerPlugin({
banner: 'require("source-map-support").install();',
raw: true, entryOnly: false
}),
new webpack.DefinePlugin({
'process.env.ENVIRONMENT': JSON.stringify('ENVIRONMENT')
})
]
};
module.exports = webpackConfig
I cannot figure out why this is happening. .env file is in the same folder as webpack config. i also tried path: ‘.env’ but nothing
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Reactions: 2
- Comments: 22 (8 by maintainers)
I got it work in Webpack 4.20.2 using:
when my file structure is
One gotcha I found is that Dotenv sets these variables as individual properties named
process.env.VARIABLE, rather than a singleprocess.envproperty with an object with separate members for each variable.I noticed this while trying examining
definitionsfrom theconst { definitions } = new Dotenv()approach in https://github.com/mrsteele/dotenv-webpack/issues/121#issuecomment-416933066The upshot is that trying to do
console.log(process.env)gave me an empty object (which made me think I was not getting any variables), but later I found that directly usingconsole.log(process.env.VARIABLE)gave me any value I wanted.That makes sense, given this library only exposes the variables you use directly.
I believe it depends on where you RUN webpack.
i.e. if you run it via your project root (which is the current assumption of the plugin), it uses
/path/to/project/root/.env. If you run webpack from a nested directory, it will most likely use that.It does not matter where your webpack.config.js file is as webpack may run from one directory and load a configuration from another.
If you want to use your webpack.config.js file as your reference point, might I suggest you do the following:
Using
__dirnamewill allow you to resolve based on the current files directory, and then use the.envthat is in the same directory as your webpack file.Let me know if that solves everything.
@edelreal
I was getting an empty object 💃
You
.envfile is not uploaded to Heroku. Please use Heroku’s console to define the environment variables. Go to Settings tab, under Config Vars.@dimon85 That is the approach I took to resolve this problem before, however what you will see is that it exposes ALL of your env variables to the bundle.
As you can see from the above, the approach suggested leaves all variables exposed. While this option is viable, it is also to be used with caution.
My solution, maybe help:
const Dotenv = require('dotenv-webpack');const { definitions } = new Dotenv();plugins: [ new webpack.DefinePlugin({ ...definitions }), ]if i add Dotenv directly to plugins, i receive empty object."dotenv-webpack": "^1.5.7","webpack": "^4.15.1",sorry for the late response,my problem that i had wrote at the beginning solved with path: path.resolve(__dirname, ‘./.env’)