TypeError: Cannot destructure property 'TITLE' of 'dotenv.parsed' as it is undefined

Question

when i npm run dev i take that error:

[webpack-cli] TypeError: Cannot destructure property 'TITLE' of 'dotenv.parsed' as it is undefined.

here is my webpack.config.js:

const path = require('path'),
  HtmlWebpackPlugin = require('html-webpack-plugin'),
  ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin'),
  ESLintPlugin = require('eslint-webpack-plugin'),
  { merge } = require('webpack-merge'),
  dotenv = require('dotenv').config(),
  devConfig = require('./config/webpack.dev.config'),
  prodConfig = require('./config/webpack.prod.config');

const APP_PATH = path.resolve(__dirname, '.', 'src');
const DIST_PATH = path.resolve(__dirname, '.', 'dist');
const TEMPLETE_PATH = path.resolve(__dirname, '.', 'public', 'index.html');
const { TITLE } = dotenv.parsed;

baseConfig = {...
..
.

that error occurs in 13th line

Answer 1

What this error is implying is that the TITLE prop isn't present in the dotenv.parsed object. One way to avoid getting the error, is to attempt this: const title = dotenv?.parsed?.TITLE; and then asserting whether the title variable holds a value different than undefined .

On another note, without further examples, I'm not able to assess why the dotenv.parsed object doesn't indeed contain the TITLE prop. If this was your initial concern, please provide your dotenv file contents (with care, please).