Angular Cannot Get

Question

I am trying to open  build and run someone else s Angular 4 project but I am not able to view the project when I run it my way  I don t see what is going wrong or what I should do now  I already had everything in place to use NPM and NodeJS  The steps I took were    Open up the project npm install ng serve   The project compiles the right way   I have an own Angular app and I know how this looks like  The console is showing           NG Live Development Server is listening on localhost 4200  open your browser on http   localhost 4200        Then  when I opened up a web browser  I navigated to localhost 4200 and a web page with the following text were shown        Cannot GET      And on the console was the following text       GET http   localhost 4200  404  Not Found     The project should work fine but I am not able to navigate to a working URL on the web page  Routing is set-up another way as I am used to doing this  In app module ts the following is implemented   app module ts  const appRoutes  Routes       path        redirectTo   tree   pathMatch   full       path   admin   component  AdminPanelComponent  canActivate   AuthGuard   children    path     component  PanelComponent   path   add   component   AddTreeComponent    path  manage-trees   component ManageTreesComponent     path  manage-users   component  ManageUsersComponent    path  view-trees    component  ViewTreeComponent      path  tree   component  TreeComponent    path  error   component  ErrorComponent    path  unauthorized   component  UnauthorizedComponent    path  login   component  LoginComponent    path  entire-tree   component  EntireTreeComponent     path        component  PageNotFoundComponent         Also opening up a web page like  localhost 4200 tree does not work  When I let angular stop serving the web page  the web page displays   this site can t be reached   So I think there is running something at localhost 4200    Also  another project of this person behaves the same way     Does anybody know what is going on    EDIT  app module ts  RouterModule forRoot appRoutes    useHash  true      Package json     name    xxx    version    0 0 0    license    MIT    scripts      ng    ng    start    ng serve    build    ng build    test    ng test    lint    ng lint    e2e    ng e2e      private   true   dependencies       angular animations     4 0 0     angular common     4 0 0     angular compiler     4 0 0     angular core     4 0 0     angular forms     4 0 0     angular http     4 0 0     angular platform-browser     4 0 0     angular platform-browser-dynamic     4 0 0     angular router     4 0 0    angular-oauth2-oidc     1 0 20    angular-polyfills     1 0 1    angular2-jwt     0 2 3    angular2-spinner     1 0 10    bootstrap     3 3 7    core-js     2 4 1    ngx-bootstrap     1 8 0    rxjs     5 1 0    zone js     0 8 4      devDependencies       angular cli    1 2 4     angular compiler-cli     4 0 0     angular language-service     4 0 0     types jasmine    2 5 45     types node     6 0 60    codelyzer     3 0 1    jasmine-core     2 6 2    jasmine-spec-reporter     4 1 0    karma     1 7 0    karma-chrome-launcher     2 1 1    karma-cli     1 0 1    karma-jasmine     1 1 0    karma-jasmine-html-reporter     0 2 2    karma-coverage-istanbul-reporter     1 2 1    protractor     5 1 2    ts-node     3 0 4    tslint     5 3 2    typescript     2 3 3         I also see an icon next to the tab name with the label   Error    OBSERVATION   New observation   After I ran npm install -g angular-cli I wasn t able to run ng serve   You have to be inside an angular-cli project in order to use the build command after reinstall of angular-cli   Then I ran npm install -g  angular cli latest and I was able to use ng serve again    OBSERVATION 2   After building the app with   ng build      there is no index html in the  dist  folder    When I set the website online  there is just a folder structure instead of a nice website  I think that s because there is no index html

User · Answer

Just figured out the reason when we type "ng serve" INSIDE OUR PROJECT..
for example C:\Users\EdgeTech1\Desktop\CSharp\WebAPI\MyProject>ng serve

could not resolve module C:\Users\EdgeTech1\Desktop\C
results: failed compiled

root cause:
My folder name was C# Project..

Note: I tried to remove the # in my Project Name, I rename C# Project to CSharp instead and I tried to open cmd prompt again, typed the same thing..

for example:

C:\Users\EdgeTech1\Desktop\CSharp\WebAPI\MyProject>ng serve

and my project compiled successfully.. so as much as possible avoid ASCII characters in naming projects files.

User · Answer

Many answers dont really make sense but still have upvotes  makes me currious why that would still work in some cases  In angular json  quot serve quot        quot builder quot    quot  angular-devkit build-angular dev-server quot      quot options quot          quot deployUrl quot    quot   quot        quot baseHref quot    quot   quot    worked for me

User · Answer

Check baseHref is set to       angular cli          architect              build                  builder     angular-devkit build-angular browser                options                      baseHref         if it didn t work  check if your base href in your index html is set to

User · Answer

For me the issue was that my local CLI was not the same version as my global CLI - updating it by running the following command solved the problem    npm install --save-dev  angular cli latest

User · Answer

You can see the errors after stopping debbuging by choosing the option to display ASP NET Core Web Server output in the output window  In my case I was pointing to a different templateUrl

User · Answer

First  delete existing files package lock json and node modules from your project  Then  the first step is to write npm cache clean --force  Second  also write this command npm i on the terminal  This process resolve my error   D

User · Answer

The way I resolved this error was by finding and fixing the error that the console reported   Run ng build in your command line terminal  and it should display a useful error  such as the example in red here  Property  name  does not exist on type  object

User · Answer

I had the same error caused by build errors  I ran ng build in the directory of my application which helped me correct my errors

User · Answer

See this answer here  You need to redirect all routes that Node is not using to Angular   app get      function req  res      res sendfile    server views index html

User · Answer

Generally it is a versioning issue  Node js v8 cannot compile with angular-cli 6 0 or later  angularcli v6 and above will work for lastest node versions  Please make sure if your node version is v8  then you need to install angular-cli upto 1 7 4  enter ng -v command in cmd and check the cli and node versions

User · Answer

For me it also was problem with path  but I had percentage sign in the root folder   After I replaced  20 with space  it started to work

User · Answer

I had the same problem with an Angular 9  In my case  I changed the angular json file from  quot aot quot   true  To  quot aot quot   false  It works for me

User · Answer

I was using export class TestCalendar implements OnInit   but i did not write the function   ngOnInit            Display initial            After running the command ng serve   i found out that i was not using ngOnInit       Once i implemented  it started working fine  Hope it helps someone

User · Answer

For me the issue was with  Component Selector path was pointing to wrong path  After changing it solved the issue    Component   selector   app-fetch-data   templateUrl     fetch-data component html   providers   ToolbarService  GroupService  FilterService  PageService  ExcelExportService  PdfExportService

User · Answer

Check if in index html base is set   lt head gt     lt base href     gt         lt  head gt

User · Answer

I was referring to one of my provider with two different casing  One of them was wrong but only the webpack compiler was complaining  I had to step into the ClientApp folder and use ng build or ng serve to see the errors   ASP NET Core SPA with Angular 5

User · Answer

The problem was that I ran the commands within the folder  project src app  Navigating back to the project folder so to  project and running ng serve from there solved my problem

User · Answer

This error can apparently happen for a number of reasons  Here is my experience for those who land here after searching for  Cannot GET     I experienced this error when I installed ng-bootstrap v6 into an Angular 8 project  I downgraded ng-bootstrap to v5 and it seems to be okay now  since ng-bootstrap v6 is only compatible with Angular 9   This happened while working in Visual Studio 2019 with the Angular  NET Core template  At the same time  the output panel of Visual Studio displayed this esoteric sounding error   TS1086  An accessor cannot be declared in ambient context   which led me here  which  after a little reading  made me think it was a versioning issue  It appears that it was   I fixed it by changing   ng-bootstrap ng-bootstrap     6 0 0    to   ng-bootstrap ng-bootstrap     5 0 0  in the package json file and rebuilding

User · Answer

I had the same problem with an Angular 6  app and ASP NET Core 2 0  I had just previously tried to change the Angular app from CSS to SCSS   My solution was to go to the src angularApp folder and running ng serve  This helped me realize that I had missed changing the src styles css file to src styles scss

User · Answer

The weird thing that I was experiencing was that I could make changes to the components in Visual Studio 2019 while the app was running and see my changes but  when I restarted the app  I got the Cannot Get   error  Instead of running IIS Express  I chose to run the app using Angular JS and the build window showed me that there was an error in app component ts  It turned out to be an extra   at the end of the file  Not sure how it got there but  when I removed it  the app works fine

User · Answer

Deleting node modules folder worked for me   Delete the node modules folder Run npm install  Re-run the application and it should work

[javascript] Angular: Cannot Get /

Examples related to javascript

Examples related to node.js

Examples related to angular

Examples related to typescript