Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript Angular Basics Setting Up an Angular Application Your First Angular Application

npm run serve is stuck

After I run npm run serve, webpack compile the files, but the localhost page is not working. The last message I got is webpack: Compiled successfully.

5 Answers

Neil Docherty
Neil Docherty
10,418 Points

It is a continually running process but you won't see any output once the server is running. Your terminal output will be similar to this. As you can see, the webpack: Compiled successfully. is the last message. As Freddy said, opening localhost:8080 will show that it is serving the files. To kill the process, press ctrl+c.

āžœ  photo_blog npm run serve

> photoblog@ serve /Users/neildocherty/Documents/Dev/photo_blog
> webpack-dev-server --config config/develop.config.js --inline --progress --port 8080

 70% 3/3 build modules http://localhost:8080/
webpack result is served from http://localhost:8080
content is served from /Users/neildocherty/Documents/Dev/photo_blog
404s will fallback to /index.html
 70% 4/4 build moduleswebpack: wait until bundle finished: /
 34% 4/10 build modules
[at-loader] Using typescript@2.1.4 from typescript and "tsconfig.json" from /Users/neildocherty/Documents/Dev/photo_blog/src/tsconfig.js
on.

 90% optimize assets
[at-loader] Checking started in a separate process...

[at-loader] Ok, 0.827 sec.
chunk    {0} app.82c6cf455aac96bd6253.js, app.css (app) 175 bytes {2} [rendered]
chunk    {1} polyfills.82c6cf455aac96bd6253.js (polyfills) 481 kB [rendered]
chunk    {2} vendor.82c6cf455aac96bd6253.js (vendor) 2.59 MB {1} [rendered]
Child html-webpack-plugin for "index.html":
    chunk    {0} index.html 284 bytes [rendered]
Child extract-text-webpack-plugin:
    chunk    {0} extract-text-webpack-plugin-output-filename 3.58 kB [rendered]
webpack: Compiled successfully.

Did you type in 'http://localhost:8080' into a web browser? If it's working you'll see the 'Loading...' message.

Craig Curtis
Craig Curtis
19,985 Points

Stuck too. Stuck on Loading.... Just doing this course as a refresher... Usually use angular-cli, munis the Quickstart and Tour of Heroes...

No console errors in VS Code or browsers...

Augury also doesn't recognize served up frozen Loading... as an Angular app...

Thomas Dimnet
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Thomas Dimnet
Python Development Techdegree Graduate 43,623 Points

Hi there,

there is something else you can try in order to see if you have a problem with your computer and its configuration. I suggest you to reinstall globally:

  • Node.
  • npm.
  • typescript (with npm).

The problem you are encountering is maybe because of the path roots of your computer. I had the same issue and now it works just fine on my configuration.

Tell me if it works for you :).

Thomas.

I had the same issue at one point in the course - where everything compiled successfully but the local host page just said loading.....

I solved my problem by removing comment code I accidentally put inside of a tag element (on the last video for form validation he has us create a 3 line div.)

Just thought I would put that out there in case someone makes the same mistake!