new components

[sarahnaft]

Hi! I'm new to angular 2, so I could just be doing this completely wrong, but i'm trying to add a new component(off a fresh copy), and I did the angular cli ng g component my-new-component which added the component fine, but when I add it to the RouterModule in app.module.ts and try to load the page (localhost:4200/newcomponent) it gives me this error Error: ENOENT: no such file or directory, stat 'Desktop/Angular2-Full-Stack-master/dist/index.html' at Error (native). Am I just not adding it somewhere? the console only says Failed to load resource: the server responded with a status of 404 (Not Found)

[nahwinrajan]

that error message state that it can't find the entry html file and nothing about the new component causing the problem.

can you state which run command you use, is there any index.html file and its location ?

[sarahnaft]

I followed the directions exactly. npm i then mongod, npm run be, and npm start which loads the app fine on localhost but this is all that shows up in my dist folder(screenshot attached).

[nahwinrajan]

how do you create that "dist folder ?

can you just copy the index.html from "src/index.html" to "dist/index.html" ?

[sarahnaft]

I have absolutely no idea. I know thats not helpful. But i tried yet again downloading a fresh copy, running the commands in the directions (this time a dist folder did not magically appear) but I got the same error when i try to load the new component. so I tried creating a dist folder(just in my text editor) and copy pasting the index.html, but it doesn't load the app, it just says Loading...

[nahwinrajan]

before my previous reply I've followed the instruction on the Readme.md even tried running the production build but it never create a dist folder.

• open a terminal and run npm install
• on that same terminal window run mongod
• create a new window/tab of the terminal run npm run be
• create another new window/tab of the terminal run npm start.

so you'll end up with 3 terminal window/tab.

will look into it again later today.

[sarahnaft]

So I did that exactly, but now if i go to the browser and type in localhost:4200/about and hit enter, it errors out in the window where npm run be is. But theres no dist folder.

GET /about 404 0.935 ms - 164 Error: ENOENT: no such file or directory, stat '/Desktop/Angular2-Full-Stack-master/dist/index.html' at Error (native)

[nahwinrajan]

maybe the problem is coming from (Angular2-Full-Stack/src/server/app.js):

app.get('/*', function(req, res) {
    res.sendFile(path.join(__dirname,'/../../dist/index.html'));
  });

notice the

res.sendFile(path.join(__dirname,'/../../dist/index.html'));

try to put the right path to the index.html on your folder either in dist folder or any index.html that you can find.

P.S: well in my copy there is no "dist" folder but it is still working fine. another funny thing is that there is only one index.html and it is just one folder up.

[sarahnaft]

Hmm, I tried changing the path to src/index.html and now i don't get the error, but if i go to and then reload the /about page it doesn't actually load the app, it just says "Loading..." there also aren't any errors in the console or any of the terminal windows

[nahwinrajan]

I'm still wondering about why that dist folder exist..

Anyway can't say much without seeing the actual folder on your end...
I did add the new component, production build command, go to about and its all find..

So might be some command typo on generating / compiling the project..

[sarahnaft]

Strange... Would you mind giving me a list of the exact commands you used for that? I'm going to try to start fresh

[nahwinrajan]

Same as I gave you yesterday, so after I git clone this project to a folder I do the mentioned steps above.

[sarahnaft]

How did you add the new component, production build command, etc?

[DavideViolante]

You are right, if you visit the /about URL directly (for example) you get an error. In angular beta 28 the dist folder is now automatically removed on ng serve (see angular/angular-cli#4293).
I will update the project using ng new (since they removed also ng update) and I will try to solve this issue.

[DavideViolante]

I updated the project, now everything should work fine, let me know.
Now you can run the project simply with npm start. The dist folder will be created and never removed.
The only downside now is that there is no browser autoreload...

[sarahnaft]

Thanks David! I tried re downloading, running npm i and then npm startand got this error (attached) and no dist folder was created

[DavideViolante]

Update your version of NodeJS and also do sudo npm i -g @angular/cli to update to latest cli. Also delete node_modules and run npm i again because some packages changed. I'm not sure this will fix your error. It seems it cannot find the .angular-cli.json file for some reason.

[sarahnaft]

I tried updating everything(node to v 6.10.0, as well as angular cli), and reinstalling node_modules but i'm still getting the same error...

[DavideViolante]

Try to rename .angular-cli.json to angular-cli.json.
Can't find much on Google about this error.
Let me know if you solve somehow.

[rainstormza]

I just try to download this project from git.

• cd to project
• npm install
• sudo npm start (I think mongod command need sudo to run)
• go to url localhost:3000
• everything should work fine

@sarahnaft

[sarahnaft]

I opened it up this morning and it magically started working ¯_(ツ)_/¯ I wonder if theres some kind of cache or something... Anyway thank you all so much for helping, especially David for updating the project!