CODEWITHSUNDEEP
javascriptreactjswebbabeljsbabel-loader
be_wander
be_wander

Reputation: 3

Module parse error & cannot read properties of undefined

I was making a React file and this problem arrived: TypeError: Cannot read properties of undefined (reading 'map')

  35 |                </Select>
  36 |            </FormControl>
  37 | 
> 38 |            <Grid container spacing={3} className={classes.list}>
     | ^  39 |                {places.map((place, i) => (
  40 |                    <Grid item key={i} xs={12}>
  41 |                        <PlaceDetails place={place}/>

I found on the web that I could solve this problem by applying an ?. on {places.map...}, then it will be {places?.map.... I solved the first problem, but, unfortunately, this happened when I saved the changes: ` ./src/components/List/List.jsx 153:12 Module parse failed: Unexpected token (153:12) You may need an appropriate loader to handle this file type. | columnNumber: 13 | }

}, places?.map(function (place, i) { | return /#PURE/React.createElement(Grid, { | item: true, `

Does anyone know what I need to do to solve the problem? Did I make the right choice using ?. or maybe I need to make something different?

I understand that the ?. can't be recognized in my project (and I don't know why), but I know he can solve my problem. Here's where I find the ?. solution

Upvotes: 0

Views: 709

Answers (1)

Rocky Sims
Rocky Sims

Reputation: 3608

Change

{places.map...

to

{places && places.map...

so it won't try to display the places when places is falsy.

Upvotes: 1

Related Questions