Chapter 6 Prop types

React Programming
1

Chapter 6 Discussion

2

Hi, just joined the forum. I’ve been working through the book the last few days, and I’ve really enjoyed it. I feel like I’ve learned a lot so far. Unfortunately, I’ve come up on my first road block, and I’ve tried several things to try and get through it, but it doesn’t look like any of them have worked.

I’ve gotten to where I install the ‘prop-types’ library, and I’ve updated the code in Thumbnail.js to import PropTypes and then add PropTypes to the Thumbnail component. However, my code continues to say that “prop-types should be listed in the project’s dependencies.” In my package.json file, it is indeed there in the dependencies, along with the package-lock file.

I’ve attached a screenshot of the code:

codescreenshot
codescreenshot1160×1325 82.6 KB

If there are any solutions to this, I’d appreciate it. It’s entirely possible I could have some of the code in the wrong place. Thanks!

3

Hi, Thanks for reaching out.
ESLint/VSCode cache the list of installed dependencies, resulting in that error message showing up sometimes for recently installed dependencies.
Restarting the application, either in the terminal if you’re seeing errors in the browser and/or restarting VSCode, should help. (Note: you will likely see this sort of thing as you continue installing other new dependencies during the rest of the book.)
Let me know if that helps or if you’re still seeing the error after restarting.

4

I was able to get past that after restarting VSCode, it was able to pick up the prop types. I reached the end of the chapter; I’ve updated the code to that point, but I’m not seeing the icons organized across as they appear in the book, they are still appearing vertically. Not sure if it has something to do with Chrome or something else.

Thanks for your help with my previous question!

5

They should display properly in any browser. Maybe double check the CSS files and the className(s) on your React components. You could also diff the files against the solution files for the chapter (which are in the resources.zip)

1 Like
6

I forgot the

{title}

in the Thumbnail.js file, which was why the names weren’t showing up under the icons. And in the home.css file, there was nothing about my code and the code from the answer file that was different except the indentation, but when I used the answer file, it made the icons display correctly. So that worked! Thanks!