it-swarm.com.de

Winkel: kann nicht erhalten /

Ich versuche, das Angular 4-Projekt einer anderen Person zu öffnen, zu erstellen und auszuführen, aber ich kann das Projekt nicht anzeigen, wenn ich es auf meine Weise leite. Ich sehe nicht, was schief läuft oder was ich jetzt tun sollte. Ich hatte bereits alles vorhanden, um NPM und NodeJS zu verwenden

Die Schritte, die ich unternahm, waren:

  • Öffnen Sie das Projekt
  • npm installieren
  • ng dienen

Das Projekt kompiliert den richtigen Weg. (Ich habe eine eigene Angular-App und weiß, wie das aussieht.) Die Konsole zeigt: 

'** NG Live Development Server hört auf localhost: 4200, öffnen Sie Ihren Browser unter http: // localhost: 4200 **'.

Als ich dann einen Webbrowser öffnete, navigierte ich zu localhost: 4200 und eine Webseite mit dem folgenden Text wurden angezeigt: 

'Kann nicht bekommen /'

Und auf der Konsole stand folgender Text:

"GET http: // localhost: 4200/ 404 (nicht gefunden)"

Das Projekt sollte gut funktionieren, aber ich kann nicht zu einer funktionierenden URL auf der Webseite navigieren. Routing ist anders eingerichtet, da ich es gewohnt bin. In app.module.ts ist Folgendes implementiert:

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 },
];

Öffnen Sie auch eine Webseite wie; localhost: 4200/tree funktioniert nicht. Wenn ich die Einstellung der Webseite durch Angle aufhören lasse, wird auf der Webseite angezeigt: "Diese Seite ist nicht erreichbar". Ich glaube, bei localhost läuft etwas: 4200 ... Auch ein anderes Projekt dieser Person verhält sich genauso .

 enter image description here

Weiß jemand, was los ist? 

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"
 }
}

Neben dem Tabellennamen wird ein Symbol mit der Bezeichnung "Fehler" angezeigt.

ÜBERWACHUNG:

Neue Beobachtung:

Nachdem ich npm install -g angular-cli ausgeführt habe, konnte ich ng serve nicht ausführen. (Sie müssen sich in einem angle-cli-Projekt befinden, um den build-Befehl nach der Neuinstallation von angle-cli verwenden zu können.)

Dann lief ich npm install -g @angular/[email protected] und konnte ng serve wieder verwenden. 

BEOBACHTUNG 2:

Nach dem Erstellen der App mit: 'ng build ...' befindet sich im Ordner 'dist' keine index.html ... Wenn ich die Website online stelle, gibt es nur eine Ordnerstruktur anstelle einer Nice-Website. Ich denke das liegt daran, dass es keine index.html gibt.

13
Klyner

Das Problem war, dass ich die Befehle im Ordner /project/src/app ausgeführt habe. Das Navigieren zurück zum Projektordner, also zu /project, und Ausführen von ng serve von dort aus löste mein Problem.

7
Klyner

Für mich war es auch ein Problem mit dem Pfad, aber ich hatte Prozentzeichen im Stammordner.

Nachdem ich% 20 durch Leerzeichen ersetzt habe, fing es an zu arbeiten :)

10
yezior

Ich hatte denselben Fehler, der durch Build-Fehler verursacht wurde. Ich habe ng build im Verzeichnis meiner Anwendung ausgeführt, wodurch ich meine Fehler korrigieren konnte

6
J.Kirk.

Ich hatte das gleiche Problem, als ich meine Winkel-App mit Visual Studio ausführte. Fehler beim Abruf "Kann nicht/abrufen" im Browser. nichts genaueres. Dann wurde der Befehl "ng build" über die Befehlszeile ausgeführt. Dann zeigte es den wirklichen Fehler.

 enter image description here

3
DineshNS

Ich habe export class TestCalendar implements OnInit{} verwendet, aber ich habe die Funktion nicht geschrieben

 ngOnInit() {
    /* Display initial */
  }

. Nachdem ich den Befehl ng serve ausgeführt hatte, stellte ich fest, dass ich ngOnInit(){} nicht verwendete. Nach der Implementierung funktionierte es einwandfrei. Hoffe es hilft jemandem.

2
MuhammadMohsan

Ich hatte das gleiche Problem mit einer Angular 6+ App und ASP.NET Core 2.0

Ich hatte gerade versucht, die Angular-App von CSS zu SCSS zu ändern.

Meine Lösung bestand darin, zum Ordner src/angularApp zu gehen und ng serve auszuführen. Dies half mir zu erkennen, dass ich die src/styles.css-Datei nicht in src/styles.scss geändert hatte

2
MaylorTaylor

Prüfen Sie, ob in index.html base eingestellt ist

<head>
  <base href="/">
  ...
</head>

Ich bezog mich auf einen meiner Anbieter mit zwei verschiedenen Gehäusen. Einer von ihnen war falsch, aber nur der Webpack-Compiler beschwerte sich. Ich musste in den ClientApp-Ordner springen und ng build oder ng serv verwenden, um die Fehler anzuzeigen. (ASP.NET Core SPA mit Angular 5)

1
Perrier

Finden Sie einfach den Grund heraus, wenn wir IN UNSEREM PROJEKT "ng serve" eingeben.
zum Beispiel C:\Users\EdgeTech1\Desktop\CSharp\WebAPI\MyProject>ng serve

modul C:\Users\EdgeTech1\Desktop\C konnte nicht aufgelöst werden
Ergebnisse: failed compiled

ursache:
Mein Ordnername war C# Project..

Hinweis: Ich habe versucht, den # In meinem Projektnamen zu entfernen. Stattdessen habe ich C# Project In CSharp umbenannt und versucht, cmd zu öffnen gleiche Sache..

zum Beispiel:

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

und mein Projekt wurde erfolgreich kompiliert. Vermeiden Sie so weit wie möglich ASCII Zeichen beim Benennen von Projektdateien.

0

Siehe diese Antwort hier . Sie müssen alle Routen umleiten, die Node nicht zu Angular verwenden:

app.get('*', function(req, res) {
  res.sendfile('./server/views/index.html')
})
0
jcroll

Im Allgemeinen handelt es sich um ein Versionsproblem. Node.js v8 kann nicht mit Angular-Cli 6.0 oder höher kompiliert werden. AngularCli v6 und höher funktioniert für die neuesten Knotenversionen. Bitte stellen Sie sicher, dass Sie Angular-Cli bis 1.7.4 installieren müssen, wenn Ihre Knotenversion v8 ist. Geben Sie den Befehl ng -v in cmd ein und überprüfen Sie die CLI- und Node-Versionen.

0
user11193342