Caution: An issue has been encountered when attempting to use the format function of the timeago library

WARNING in ./node_modules/timeago.js/esm/format.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\format.ts' file: Error: ENOENT: no such file or directory, open 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\format.ts'

WARNING in ./node_modules/timeago.js/esm/index.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\index.ts' file: Error: ENOENT: no such file or directory, open 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\index.ts'
WARNING in ./node_modules/timeago.js/esm/lang/en_US.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\lang\en_US.ts' file: Error: ENOENT: no such file or directory, open 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\lang\en_US.ts'

WARNING in ./node_modules/timeago.js/esm/lang/zh_CN.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\lang\zh_CN.ts' file: Error: ENOENT: no such file or directory, open 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\lang\zh_CN.ts'

WARNING in ./node_modules/timeago.js/esm/realtime.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\realtime.ts' file: Error: ENOENT: no such file or directory, open 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\realtime.ts'

WARNING in ./node_modules/timeago.js/esm/register.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\register.ts' file: Error: ENOENT: no such file or directory, open 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\register.ts'

WARNING in ./node_modules/timeago.js/esm/utils/date.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\utils\date.ts' file: Error: ENOENT: no such file or directory, open 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\utils\date.ts'

WARNING in ./node_modules/timeago.js/esm/utils/dom.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\utils\dom.ts' file: 
Error: ENOENT: no such file or directory, open 'C:\Users\SMDP-\Desktop\media-social\client\node_modules\timeago.js\src\utils\dom.ts'

i'm experiencing issues with debugging this problem on my new react project.
Any help would be greatly appreciated.

To fix these warnings
I attempted adding the following line in the package.json file but it didn't resolve the issue.
Warnings are still persisting.

GENERATE_SOURCEMAP=false
reactjsnpmtimeago

Answer №1

If you want to implement timeago in your React project, make sure to install the react-timeago package using npm:

npm install react-timeago

Do not use the standard "plain" timeago package for this purpose.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Error: Required package bootstrap-duallistbox@github:istvan-ujjmeszaros/bootstrap-duallistbox is not found

After running npm install to install packages, I encountered the following error : npm ERR! code ELOCKVERIFY npm ERR! Errors were found in your package-lock.json, run npm install to fix them. npm ERR! Missing: bootstrap-duallistbox@github:istvan-ujj ...

reactjsnpmwebpackpackage.jsonsmartadmin

What steps can be taken to avoid including empty tasks in React code?

Is there a way to prevent my application from adding empty tasks? Below is the code snippet for adding a new task to an array. How can I implement a condition to block the addition of empty tasks? This application follows Mozilla's guidelines for a R ...

javascriptreactjs

Trigger a function post-rendering in a React component

Hey everyone, hope you're having a great day! I've been diving into React for a few months now. I'm making an effort to steer clear of using the traditional React Components, opting instead for React Hooks. However, there are instances wher ...

javascriptreactjsreact-hooks

Encountering an issue with state setting - Experiencing an excessive amount of re-renders in a

If you want to see the solution in action, check out the Code Sandbox link provided below for better clarity on the issue at hand. Currently facing an issue with setting my mymoviegenreobjects as the mymoviegenreinfo state within the useFetchMovieGenreRes ...

javascriptreactjsnext.jssetstate

Expo React Native Month and Year Picker

Can anyone help me figure out how to create a date picker with just a month and year spinner, similar to the one used in LinkedIn job experiences? Are there any npm packages for Expo managed workflow or React Native that support this type of configuration ...

react-nativenpmdatepickerexpo

Is there a way to turn off the background in a Material UI modal?

Is it possible to utilize the material ui modal component while maintaining access to the content behind the modal? I am aware that the background color can be changed with backdropProps, but is there a way to completely disable the background and contin ...

reactjsmaterial-ui

Tips for inserting a new row directly beneath the header in Google Sheets using the google-spreadsheet npm module:

While I have successfully been able to insert rows below the existing ones using the google-spreadsheet package, my goal is to add a row at the top of the existing rows just beneath the header - essentially inserting it at Row 2 and shifting all other rows ...

node.jsnpmgoogle-sheets-api

Incorporating multiple web services into a React JS project to populate a Material UI dropdown efficiently

I have some code that is calling a web service and I have a few questions. Firstly, what is the best way to call a second web service? Currently, I am calling one and displaying the data in a list. But if I need to call a second web service, should I also ...

javascriptreactjsmaterial-ui

Unexpected behavior observed with Mui theme breakpoints

I have defined breakpoints for my MUI React-based app like so export const lighttheme = createTheme({ palette: palette, typography: typography, breakpoints: { values: { xs: 0, sm: 600, md: 900, lg: 1200, xl: 1536, ...

cssreactjsmaterial-uibreakpoints

Creating a React header with a scroll-triggered shadow effect using Tailwind CSS

Is there a way to dynamically add a shadow to a header in React based on the scroll position? I want the header to have no shadow when the scrollbar is at its initial (0) position, and then add a shadow as the user scrolls. Below is the code snippet for th ...

reactjsscrollheadertailwind-cssnavbar

Issue arising from background change upon component focus

My component needs to change its background color when focused, but for some reason it's not working. The hover effect works fine, but the focus doesn't. Can anyone assist me with this issue? import { CardContainer } from './styles' in ...

javascripthtmlcssreactjsstyled-components

Animated collapse with margin effect in Material-UI

I have been utilizing the MUI-Collapse component to display collapsible content within a list. I am looking to add vertical spacing between the Collapse components in the list, but I do not want the spacing to remain when the Collapse is collapsed. I am ha ...

htmlcssreactjsmaterial-ui

Error: Unable to locate Mix manifest file in Laravel 5.7

I recently started learning Laravel 5.7 and encountered an error that says: The Mix manifest does not exist. (View: /var/www/html/laravel/resources/views/frontend/layouts/app.blade.php) Any help would be greatly appreciated. ...

laravel-5npmnpm-installlaravel-mix

Having trouble with retrieving API on nextjs 13 (application directory)?

I am encountering an issue while trying to retrieve data from a headless CMS (Strapi). The error message "Error: _hooks_useFetch__WEBPACK_IMPORTED_MODULE_2___default(...) is not a function" keeps popping up in Data.js. Can anyone assist me in understanding ...

reactjsnext.js

Issue with react-bootstrap-table2: Pagination dropdown feature malfunctioning

I am having trouble with the pagination drop down in react-bootstrap-table2. Here are my options: const options = { paginationSize: 4, pageStartIndex: 0, //alwaysShowAllBtns: true, // Always show next and pre ...

reactjsbootstrap-4react-bootstrap-table

Tips for consistently aligning icons to the right in Material Grid items, regardless of screen changes

After studying JavaScript React, I have come across a challenging question: Recently, I created a project on Codesandbox The main issue is that I am struggling to align the icon next to the input field as shown in the image below. https://i.stack.imgur. ...

reactjsmaterial-uiright-align

Error encountered in lodash.js in Angular 2 framework

I have been attempting to implement lodash for a datatable. Here are the steps I followed: First, I tried running npm install lodash, but encountered an error stating that the package could not be found After researching the issue, I attempted npm in ...

node.jsangularnpmlodash

Having trouble with onKeyPress event not triggering in React 16 code

Currently, I am experimenting with triggering a response based on keypress events. import React, {Component} from 'react'; import PropTypes from 'prop-types' class ItemTextEdit extends React.Component { constructor(){ sup ...

reactjsreact-redux

Is there a way to remove the ring shadow in TailwindCSS?

Here is a visual representation of the issue I'm facing (refer to the image): Check out the Image After inspecting with Chrome, it seems like the problem is connected to --tw-ring-shadow. I attempted to use classes like ring-0 and ring-offset-0 (men ...

cssreactjsmaterial-uitailwind-cssinput-field

Can the PKCE flow with okta-react be configured to store the okta-token-storage in cookies instead of local storage? If so, how can

In order to comply with our organizational policy, I have successfully implemented the PKCE flow using the @okta/okta-react library. However, after a successful login, the accessToken and idToken are currently being stored in local storage instead of cooki ...

reactjscookieslocal-storagepkceokta-signin-widget