Module not found: Error: Can't resolve './dist/server/main.bundle'

我尝试使用https://angular.io/guide/universal并将我的代码与Angular Universal中的SSR文件相匹配.这对我不起作用.

似乎dist文件夹没有生成/ server文件夹,但正在创建/浏览器.我不确定为什么.

这是我的angular.json文件

{
 "$schema": "./node_modules/@angular/cli/lib/config/schema.json","version": 1,"newProjectRoot": "projects","projects": {
    "xilo": {
      "root": "","sourceRoot": "src","projectType": "application","architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser","options": {
            "outputPath": "dist/browser","index": "src/index.html","main": "src/main.ts","tsConfig": "src/tsconfig.app.json","polyfills": "src/polyfills.ts","assets": [
              "src/assets","src/favicon.ico"
            ],"styles": [
              "src/styles.css","node_modules/font-awesome/css/font-awesome.min.css"
            ],"scripts": [
              "node_modules/moment/min/moment.min.js"
            ]
          },"configurations": {
            "production": {
              "optimization": true,"outputHashing": "all","sourceMap": false,"extractCss": true,"namedChunks": false,"aot": true,"extractLicenses": true,"vendorChunk": false,"buildOptimizer": true,"fileReplacements": [
                {
                  "replace": "src/environments/environment.ts","with": "src/environments/environment.prod.ts"
                }
              ]
            }
          }
        },"serve": {
          "builder": "@angular-devkit/build-angular:dev-server","options": {
            "browserTarget": "xilo:build"
          },"configurations": {
            "production": {
              "browserTarget": "xilo:build:production"
            }
          }
        },"extract-i18n": {
          "builder": "@angular-devkit/build-angular:extract-i18n","options": {
            "browserTarget": "xilo:build"
          }
        },"test": {
          "builder": "@angular-devkit/build-angular:karma","options": {
            "main": "src/test.ts","karmaConfig": "./karma.conf.js","tsConfig": "src/tsconfig.spec.json","scripts": [
              "node_modules/moment/min/moment.min.js"
            ],"src/favicon.ico"
            ]
          }
        },"lint": {
          "builder": "@angular-devkit/build-angular:tslint","options": {
            "tsConfig": [
              "src/tsconfig.app.json","src/tsconfig.spec.json"
            ],"exclude": [
              "**/node_modules/**"
            ]
          }
        },"server": {
          "builder": "@angular-devkit/build-angular:server","options": {
            "outputPath": "dist/server","main": "main.server.ts","tsConfig": "tsconfig.server.json"
          }
        }
      }
    },"xilo-e2e": {
      "root": "","sourceRoot": "e2e","architect": {
        "e2e": {
          "builder": "@angular-devkit/build-angular:protractor","options": {
            "protractorConfig": "./protractor.conf.js","devServerTarget": "xilo:serve"
          }
        },"options": {
            "tsConfig": [
              "e2e/tsconfig.e2e.json"
            ],"exclude": [
              "**/node_modules/**"
            ]
          }
        }
      }
    }
  },"defaultProject": "xilo","schematics": {
    "@schematics/angular:class": {
      "spec": false
    },"@schematics/angular:component": {
      "spec": false,"inlineStyle": true,"inlineTemplate": true,"prefix": "app","styleext": "css"
    },"@schematics/angular:directive": {
      "spec": false,"prefix": "app"
    },"@schematics/angular:guard": {
      "spec": false
    },"@schematics/angular:module": {
      "spec": false
    },"@schematics/angular:pipe": {
      "spec": false
    },"@schematics/angular:service": {
      "spec": false
    }
  }
}

server.ts

// These are important and needed before anything else
import 'zone.js/dist/zone-node';
import 'reflect-Metadata';

import { enableProdMode } from '@angular/core';

import * as express from 'express';
import { join } from 'path';

// Faster server renders w/ Prod mode (dev mode never needed)
enableProdMode();

// Express server
const app = express();

const PORT = process.env.PORT || 4000;
const DIST_FOLDER = join(process.cwd(),'dist');

// * NOTE :: leave this as require() since this file is built Dynamically from webpack
const { AppServerModuleNgFactory,LAZY_MODULE_MAP } = require('./dist/server/main.bundle');

// Express Engine
import { ngExpressEngine } from '@nguniversal/express-engine';
// Import module map for lazy loading
import { provideModuleMap } from '@nguniversal/module-map-ngfactory-loader';

app.engine('html',ngExpressEngine({
  bootstrap: AppServerModuleNgFactory,providers: [
    provideModuleMap(LAZY_MODULE_MAP)
  ]
}));

app.set('view engine','html');
app.set('views',join(DIST_FOLDER,'browser'));

// TODO: implement data requests securely
app.get('/api/*',(req,res) => {
  res.status(404).send('data requests are not supported');
});

// Server static files from /browser
app.get('*.*',express.static(join(DIST_FOLDER,'browser')));

// All regular routes use the Universal engine
app.get('*',res) => {
  res.render('index',{ req });
});

// Start up the Node server
app.listen(PORT,() => {
  console.log(`Node server listening on http://localhost:${PORT}`);
});

一切都完全按照Angular Universal方向设置.

任何人都知道为什么我的构建脚本不会生成/ server文件夹？

"build:ssr": "npm run build:client-and-server-bundles && npm run webpack:server"

的package.json

{
  "name": "XXX","version": "XXX","license": "MIT","repository": {
    "type": "git","url": "XXXXX"
  },"engines": {
    "node": "10.7.0","npm": "6.1.0"
  },"scripts": {
    "ng": "ng","start": "node dist/server","build": "ng build","build:client-and-server-bundles": "ng build --prod && ng build --prod --project xilo --output-hashing=all","build:prerender": "npm run build:client-and-server-bundles && npm run webpack:server && npm run generate:prerender","build:ssr": "npm run build:client-and-server-bundles && npm run webpack:server","deploy": "git push origin master && git push heroku master","generate:prerender": "cd dist && node prerender","postinstall": "npm run build:ssr","webpack:server": "webpack --config webpack.server.config.js --progress --colors","serve:prerender": "cd dist/browser && http-server","serve:ssr": "node dist/server"
  },"private": true,"dependencies": {
    "@angular/animations": "6.1.0","@angular/common": "6.1.0","@angular/compiler": "6.1.0","@angular/compiler-cli": "6.1.0","@angular/core": "^6.1.0","@angular/forms": "6.1.0","@angular/http": "6.1.0","@angular/language-service": "6.1.0","@angular/platform-browser": "6.1.0","@angular/platform-browser-dynamic": "6.1.0","@angular/platform-server": "6.1.0","@angular/router": "6.1.0","@nguniversal/express-engine": "^5.0.0-beta.5","@nguniversal/module-map-ngfactory-loader": "^5.0.0-beta.5","@nicky-lenaers/ngx-scroll-to": "^0.5.0","@types/moment": "^2.13.0","@types/node": "^8.10.21","angular-file": "^0.4.1","angular2-moment": "^1.9.0","classlist.js": "^1.1.20150312","core-js": "^2.5.7","cpy-cli": "^1.0.1","express": "^4.16.3","font-awesome": "^4.7.0","http-server": "^0.10.0","moment": "^2.22.2","ng-circle-progress": "^0.9.9","ng-hotjar": "0.0.13","ng-intercom": "^1.0.0-beta.5-2","ng2-google-charts": "^3.4.0","ng4-geoautocomplete": "^0.1.0","ngx-filter-pipe": "^1.0.2","ngx-loading": "^1.0.14","ngx-pagination": "^3.0.3","reflect-Metadata": "^0.1.10","rxjs": "^6.2.2","rxjs-compat": "^6.2.2","ts-loader": "^4.4.2","typescript": "2.9.2","web-animations-js": "^2.3.1","zone.js": "^0.8.20"
  },"devDependencies": {
    "@angular-devkit/build-angular": "~0.6.8","@angular/cli": "^6.0.8","webpack-cli": "^3.1.0"
  }
}