title: Building angular application and putting on the server
body: <p>I'm developing an angular6 application and I want to generate a build to test on my server, currently I use ng server and it runs working on my browser without generating any errors.</p>
  
  <blockquote>
    <p>c:\Users\emiry\Desktop\Angular\Projects\StartingNewProject</p>
  </blockquote>
  
  <p>when I run the <code>ng build</code> command it generates a build for the /dist folder and returns no errors</p>
  
  <p>on my machine I have installed <code>wamp64</code> so I get this build generated by ng and put it in my www folder</p>
  
  <blockquote>
    <p>C:\wamp64\www\StartingNewProject</p>
  </blockquote>
  
  <p>Just this would be enough for me to be able to run my application on the server?</p>
  
  <p>when I try to access my application that is on the server through the http:// localhost/startingnewproject/</p>
  
  <p>it returns me the following error in the browser console</p>
  
  <blockquote>
    <p>Failed to load resource: the server responded with a status of 404
    (Not Found) polyfills.js:1 Failed to load resource: the server
    responded with a status of 404 (Not Found) styles.js:1 Failed to load
    resource: the server responded with a status of 404 (Not Found)
    vendor.js:1 Failed to load resource: the server responded with a
    status of 404 (Not Found) main.js:1 Failed to load resource: the
    server responded with a status of 404 (Not Found)</p>
  </blockquote>
  
  <p><strong>angular.json</strong></p>
  
  <pre><code>{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "version": 1,
    "newProjectRoot": "projects",
    "projects": {
      "StartingNewProject": {
        "root": "",
        "sourceRoot": "src",
        "projectType": "application",
        "prefix": "app",
        "schematics": {},
        "architect": {
          "build": {
            "builder": "@angular-devkit/build-angular:browser",
            "options": {
              "outputPath": "dist/StartingNewProject",
              "index": "src/index.html",
              "main": "src/main.ts",
              "polyfills": "src/polyfills.ts",
              "tsConfig": "src/tsconfig.app.json",
              "assets": [
                "src/favicon.ico",
                "src/assets"
              ],
              "styles": [
                "src/styles.css",
                {
                  "input": "./node_modules/bootstrap/dist/css/bootstrap.css"
                }
              ],
              "scripts": []
            },
            "configurations": {
              "production": {
                "fileReplacements": [
                  {
                    "replace": "src/environments/environment.ts",
                    "with": "src/environments/environment.prod.ts"
                  }
                ],
                "optimization": true,
                "outputHashing": "all",
                "sourceMap": false,
                "extractCss": true,
                "namedChunks": false,
                "aot": true,
                "extractLicenses": true,
                "vendorChunk": false,
                "buildOptimizer": true
              }
            }
          },
          "serve": {
            "builder": "@angular-devkit/build-angular:dev-server",
            "options": {
              "browserTarget": "StartingNewProject:build"
            },
            "configurations": {
              "production": {
                "browserTarget": "StartingNewProject:build:production"
              }
            }
          },
          "extract-i18n": {
            "builder": "@angular-devkit/build-angular:extract-i18n",
            "options": {
              "browserTarget": "StartingNewProject:build"
            }
          },
          "test": {
            "builder": "@angular-devkit/build-angular:karma",
            "options": {
              "main": "src/test.ts",
              "polyfills": "src/polyfills.ts",
              "tsConfig": "src/tsconfig.spec.json",
              "karmaConfig": "src/karma.conf.js",
              "styles": [
                "src/styles.css"
              ],
              "scripts": [],
              "assets": [
                "src/favicon.ico",
                "src/assets"
              ]
            }
          },
          "lint": {
            "builder": "@angular-devkit/build-angular:tslint",
            "options": {
              "tsConfig": [
                "src/tsconfig.app.json",
                "src/tsconfig.spec.json"
              ],
              "exclude": [
                "**/node_modules/**"
              ]
            }
          }
        }
      },
      "StartingNewProject-e2e": {
        "root": "e2e/",
        "projectType": "application",
        "architect": {
          "e2e": {
            "builder": "@angular-devkit/build-angular:protractor",
            "options": {
              "protractorConfig": "e2e/protractor.conf.js",
              "devServerTarget": "StartingNewProject:serve"
            },
            "configurations": {
              "production": {
                "devServerTarget": "StartingNewProject:serve:production"
              }
            }
          },
          "lint": {
            "builder": "@angular-devkit/build-angular:tslint",
            "options": {
              "tsConfig": "e2e/tsconfig.e2e.json",
              "exclude": [
                "**/node_modules/**"
              ]
            }
          }
        }
      }
    },
    "defaultProject": "StartingNewProject"
  }
  </code></pre>
  
  <p><strong>package.json</strong></p>
  
  <pre><code>{
    "name": "starting-new-project",
    "version": "0.0.0",
    "scripts": {
      "ng": "ng",
      "start": "ng serve",
      "build": "ng build",
      "test": "ng test",
      "lint": "ng lint",
      "e2e": "ng e2e"
    },
    "private": true,
    "dependencies": {
      "@angular/animations": "^6.0.3",
      "@angular/common": "^6.0.3",
      "@angular/compiler": "^6.0.3",
      "@angular/core": "^6.0.3",
      "@angular/forms": "^6.0.3",
      "@angular/http": "^6.0.3",
      "@angular/platform-browser": "^6.0.3",
      "@angular/platform-browser-dynamic": "^6.0.3",
      "@angular/router": "^6.0.3",
      "@ng-bootstrap/ng-bootstrap": "^2.0.0-alpha.0",
      "@ng-bootstrap/schematics": "^2.0.0-alpha.1",
      "bootstrap": "^4.0.0",
      "core-js": "^2.5.4",
      "jshint": "^2.9.5",
      "rxjs": "^6.0.0",
      "zone.js": "^0.8.26"
    },
    "devDependencies": {
      "@angular/compiler-cli": "^6.0.3",
      "@angular-devkit/build-angular": "~0.6.8",
      "typescript": "~2.7.2",
      "@angular/cli": "~6.0.8",
      "@angular/language-service": "^6.0.3",
      "@types/jasmine": "~2.8.6",
      "@types/jasminewd2": "~2.0.3",
      "@types/node": "~8.9.4",
      "codelyzer": "~4.2.1",
      "jasmine-core": "~2.99.1",
      "jasmine-spec-reporter": "~4.2.1",
      "karma": "~1.7.1",
      "karma-chrome-launcher": "~2.2.0",
      "karma-coverage-istanbul-reporter": "~2.0.0",
      "karma-jasmine": "~1.1.1",
      "karma-jasmine-html-reporter": "^0.2.2",
      "protractor": "~5.3.0",
      "ts-node": "~5.0.1",
      "tslint": "~5.9.1"
    }
  }
  </code></pre>
  
  <p>I tried to access as follows</p>
  
  <blockquote>
    <p>file:///C:/wamp64/www/StartingNewProject/index.html</p>
    
    <p>5index.html:13 GET file:///C:/runtime.js 0 () /C:/favicon.ico:1 GET
    file:///C:/favicon.ico 0 ()
    translate.google.com/gen204?nca=te_li&amp;client=te_lib&amp;logld=vTE_20180625_00:1
    GET
    file://translate.google.com/gen204?nca=te_li&amp;client=te_lib&amp;logld=vTE_20180625_00
    0 ()</p>
    
    <p>file:///C:/wamp64/www/StartingNewProject/index.html</p>
    
    <p>GET file:///C:/runtime.js 0 () /C:/favicon.ico:1 GET
    file:///C:/favicon.ico 0 ()</p>
  </blockquote>
  
  <p>When I try to access the root directory to see the folders and files, I can perfectly, the problem is when I load the index.html</p>