N is Undefined - React Scoreboard Not Displaying (Repo with code)

Question

I attempting to learn how to implement React Redux in my scoreboard application, per the videos hosted by treehouse. (Lesson I am following: https://teamtreehouse.com/library/building-applications-with-react-and-redux)

However, I am receiving the following errors:

Error #1: TypeError: n is undefined Scoreboard.js:23:6

Using the debugger, the following code is shown:

const playerComponents = players.map((player, index) => (
  <Player
    index = {index}
    name = {player.name}
    score = {player.score}
    key = {player.name}
    updatePlayerScore = {updatePlayerScore}
    removePlayer = {removePlayer}
/>
));

Error #2 TypeError: "n is undefined" react-dom.production.min.js:187:139

valuehttp://localhost:8080/bundle.js:6:52103Cihttp://localhost:8080/bundle.js:14:62169Nihttp://localhost:8080/bundle.js:14:67055uahttp://localhost:8080/bundle.js:14:76632cahttp://localhost:8080/bundle.js:14:76939Wahttp://localhost:8080/bundle.js:14:80513Vahttp://localhost:8080/bundle.js:14:79984zahttp://localhost:8080/bundle.js:14:79810Uahttp://localhost:8080/bundle.js:14:79183hahttp://localhost:8080/bundle.js:14:78430Zahttp://localhost:8080/bundle.js:14:85764tshttp://localhost:8080/bundle.js:14:85977renderhttp://localhost:8080/bundle.js:14:89672fshttp://localhost:8080/bundle.js:14:87876Jahttp://localhost:8080/bundle.js:14:85182fshttp://localhost:8080/bundle.js:14:87811renderhttp://localhost:8080/bundle.js:14:90459<anonymous>http://localhost:8080/bundle.js:22:5471Thttp://localhost:8080/bundle.js:1:7171rhttp://localhost:8080/bundle.js:1:565<anonymous>http://localhost:8080/bundle.js:22:106266Thttp://localhost:8080/bundle.js:1:7171<anonymous>http://localhost:8080/bundle.js:1:7611<anonymous>http://localhost:8080/bundle.js:1:2

Using the debugger, the following code is shown from Webpack:

A("166"):void 0,null;a=cg($f.current);if(Cg(b))c=b.stateNode,e=b.type,f=b.memoizedProps,c[C]=b,c[Ma]=f,d=Ue(c,e,f,a,d),b.updateQueue=d,null!==d&&Lg(b);else{a=Pe(e,c,d,a);a[C]=b;a[Ma]=c;a:for(f=b.child;null!==f;){if(5===f.tag||6===f.tag)a.appendChild(f.stateNode);else if(4!==f.tag&&null!==f.child){f.child.return=f;f=f.child;continue}if(f===b)break;for(;null===f.sibling;){if(null===f.return||f.return===b)break a;f=f.return}f.sibling.return=f.return;f=f.sibling}Re(a,e,c,d);Ze(e,c)&&Lg(b);b.stateNode=
a}null!==b.ref&&(b.effectTag|=128)}return null;case 6:if(a&&null!=b.stateNode)Rg(a,b,a.memoizedProps,c);else{if("string"!==typeof c)return null===b.stateNode?A("166"):void 0,null;d=cg(bg.current);cg($f.current);Cg(b)?(d=b.stateNode,c=b.memoizedProps,d[C]=b,Ve(d,c)&&Lg(b)):(d=Qe(c,d),d[C]=b,b.stateNode=d)}return null;case 14:return null;case 16:return null;case 10:return null;case 11:return null;case 15:return null;case 4:return eg(b),Pg(b),null;case 13:return Yf(b),null;case 12:return null;case 0:A("167");
default:A("156")}}function Tg(a,b){var c=b.source;null===b.stack&&null!==c&&vc(c);null!==c&&tc(c);b=b.value;null!==a&&2===a.tag&&tc(a);try{b&&b.suppressReactErrorLogging||console.error(b)}catch(d){d&&d.suppressReactErrorLogging||console.error(d)}}function Ug(a){var b=a.ref;if(null!==b)if("function"===typeof b)try{b(null)}catch(c){Vg(a,c)}else b.current=null}
function Wg(a){"function"===typeof Gf&&Gf(a);switch(a.tag){case 2:Ug(a);var b=a.stateNode;if("function"===typeof b.componentWillUnmount)try{b.props=a.memoizedProps,b.state=a.memoizedState,b.componentWillUnmount()}catch(c){Vg(a,c)}break;case 5:Ug(a);break;case 4:Xg(a)}}function Yg(a){return 5===a.tag||3===a.tag||4===a.tag}
function Zg(a)

Here is my repo from Github, complete with my program and its code. Any suggestions would be helpful.

https://github.com/Benmosery/React-Scoreboard-Updated

I've followed all of Guil's suggestions, but my Scoreboard still will not be displayed when npm is run.

Ben

Welcome to the Treehouse Community

Looking to learn something new?

benjaminmosery

benjaminmosery

N is Undefined - React Scoreboard Not Displaying (Repo with code)