Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript React Components (2018) Build Modular Interfaces with Components Setting up with Create React App

Posted by cloud712
cloud712
7,616 Points

Visual Studio Live Server issue: even source files return a 404 error

I'm on Windows 10 and using VS Live Server to run the code. I created a create app through the command line like in the tutorial video. The template app / skeleton compiled and displayed the generic react logo in Chrome etc. When I tried copying over the src folder from the downloads in Treehouse, I got several errors. And when I run the downloaded files in VS, the same errors come up. Is there something wrong with the code in the server?

These are the errors:

manifest.json:1 Failed to load resource: the server responded with a status of 400 (Bad Request)

127.0.0.1:5500/public/%PUBLIC_URL%/favicon.ico:1 Failed to load resource: the server responded with a status of 400 (Bad Request)

manifest.json:1 Manifest: Line: 1, column: 1, Syntax error.

manifest.json:1 Failed to load resource: the server responded with a status of 400 (Bad Request)

cloud712
cloud712
7,616 Points

hm...upon second try, I think it's an issue with VS's Live Server. I can get the app to compile and display in localhost 3000 with the command prompt npm start

Has anyone figured out how to resolve the VS Live Server issue?

Bert Witzel
.a{fill-rule:evenodd;}techdegree seal-36
Bert Witzel
Full Stack JavaScript Techdegree Graduate 27,917 Points

If I'm not mistaken, the VS Live Server extension is out of date or not currently supported. I have not had great luck with it. I have been using the Google Chrome Web Server extension with great success.

1 Answer

James Crosslin
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
James Crosslin
Full Stack JavaScript Techdegree Graduate 16,882 Points
James Crosslin
.a{fill-rule:evenodd;}techdegree seal-36
James Crosslin
Full Stack JavaScript Techdegree Graduate 16,882 Points

I know this question is old, but the answer is that you should not be using live server. The directions Guil gives are to use

$ npm start

in the command line to start your app. This is because create-react-app creates a development environment with its own scripts to handle serving pages (creating its own server) and is not compatible with Live Server. Without using Live Server Web Extension, Live server isn't only set up to handle web pages with HTML files, and you'll notice that our React app has zero HTML files.