Угловой универсальный не работающий с угловым 5 - PullRequest
Новая
       21

Угловой универсальный не работающий с угловым 5

0 голосов
/ 20 апреля 2019

Я пытаюсь добавить angular-universal в мое существующее приложение angular 5 для рендеринга на стороне сервера, так как загрузка занимает много времени, но когда я пытаюсь построить проект, он выдает эту ошибку:

/ home / ekodev / angular_b2b / ng5 / src / node_modules не существует или не является каталогом / home / ekodev / angular_b2b / node_modules не существует или не является каталогом / home/ ekodev / node_modules не существует или не является каталогом / home / node_modules не существует или не является каталогом
/ node_modules не существует или не является каталогом, ищущим модули в / home / ekodev / angular_b2b/ ng5 / node_modules, используя файл описания: /home/ekodev/angular_b2b/ng5/package.json (относительный путь: ./node_modules) после использования файла описания: /home/ekodev/angular_b2b/ng5/package.json (относительный путь:./ node_modules), используя файл описания: /home/ekodev/angular_b2b/ng5/package.json (относительный путь: ./node_modules/app/shop/shop.module.ngfactory.js) без расширения / home / ekodev / angular_b2b / ng5 / node_modules / app / shop / shop.module.ngfactory.js не существует .ts /home/ekodev/angular_b2b/ng5/node_modules/app/shop/shop.module.ngfactory.js.ts не существует.js /home/ekodev/angular_b2b/ng5/node_modules/app/shop/shop.module.ngfactory.js.js не существует в виде каталога /home/ekodev/angular_b2b/ng5/node_modules/app/shop/shop.module.ngfactory.js не существует, ища модули в / home / ekodev / angular_b2b / ng5 / node_modules, используя файл описания: /home/ekodev/angular_b2b/ng5/package.json (относительный путь: ./node_modules) после использования файла описания:/home/ekodev/angular_b2b/ng5/package.json (относительный путь: ./node_modules), используя файл описания: /home/ekodev/angular_b2b/ng5/package.json (относительный путь: ./node_modules/app/shop/shop.module.ngfactory.js) без расширения /home/ekodev/angular_b2b/ng5/node_modules/app/shop/shop.module.ngfactory.js не существует .ts / home / ekodev / angular_b2b / ng5 / node_modules / app / shop/shop.module.ngfactory.js.ts не существует .js / home / ekodev / angular_b2b / ng5 / node_modules / app / shop / shop.module.ngfactory.js.js не существует как каталог /home/ekodev/angular_b2b/ng5/node_modules/app/shop/shop.module.ngfactory.js не существует для поиска модулейin / Файл описания не найден Файл описания не найден, расширения /app/shop/shop.module.ngfactory.js не существует .ts /app/shop/shop.module.ngfactory.js.ts не существует .js/app/shop/shop.module.ngfactory.js.js не существует как каталог /app/shop/shop.module.ngfactory.js не существует

пакета.JSON выглядит следующим образом 

{
  "name": "app",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "webpack-dev-server --port=4200",
    "build": "webpack",
    "test": "karma start ./karma.conf.js",
    "lint": "ng lint",
    "e2e": "protractor ./protractor.conf.js",
    "build:universal": "npm run build:client-and-server-bundles && npm run webpack:server",
    "server:universal": "node dist/server.js",
    "build:client-and-server-bundles": "node --max_old_space_size=8192 node_modules/@angular/cli/bin/ng build --prod && ng build --prod --app 1 --output-hashing=false",
    "webpack:server": "webpack --config webpack.server.config.js --progress --colors",
    "pree2e": "webdriver-manager update --standalone false --gecko false --quiet"
  },
  "private": true,
  "dependencies": {
    "@agm/core": "^1.0.0-beta.2",
    "@angular/animations": "5.2.0",
    "@angular/cdk": "5.1.0",
    "@angular/common": "5.2.0",
    "@angular/compiler": "5.2.0",
    "@angular/core": "5.2.0",
    "@angular/flex-layout": "^2.0.0-beta.10",
    "@angular/forms": "5.2.0",
    "@angular/http": "5.2.0",
    "@angular/material": "5.1.0",
    "@angular/platform-browser": "5.2.0",
    "@angular/platform-browser-dynamic": "5.2.0",
    "@angular/platform-server": "^5.2.0",
    "@angular/router": "5.2.0",
    "@nguniversal/express-engine": "^7.1.1",
    "@nguniversal/module-map-ngfactory-loader": "^7.1.1",
    "@swimlane/ngx-charts": "^7.0.1",
    "@swimlane/ngx-datatable": "11.1.5",
    "angular-calendar": "0.23.3",
    "angular-image-slider": "0.0.8",
    "angular-sortablejs": "^2.0.6",
    "angular-tree-component": "6.1.0",
    "angular-vrviewer": "^0.1.4",
    "angular5-recaptcha": "0.0.2",
    "angular5-social-login": "^1.0.9",
    "angularfire2": "^5.0.1",
    "aws-sdk": "^2.319.0",
    "browser-sync": "^2.26.3",
    "chart.js": "2.6.0",
    "core-js": "2.4.1",
    "crypto-ts": "^1.0.2",
    "d3": "^4.9.1",
    "dragula": "3.7.2",
    "file-saver": "^2.0.1",
    "firebase": "^5.5.1",
    "font-awesome": "4.7.0",
    "hammerjs": "2.0.8",
    "intl": "^1.2.4",
    "jquery": "3.2.1",
    "leaflet": "^1.0.2",
    "moment": "^2.15.0",
    "ng-animate": "^0.3.4",
    "ng2-charts": "1.6.0",
    "ng2-dragula": "1.3.1",
    "ng2-file-upload": "1.2.1",
    "ng2-translate": "5.0.0",
    "ng2-validation": "4.2.0",
    "ngx-bootstrap": "^3.0.1",
    "ngx-color-picker": "^4.0.3",
    "ngx-device-detector": "^1.3.5",
    "ngx-editor": "^3.3.0",
    "ngx-mat-select-search": "^1.3.1",
    "ngx-material-timepicker": "^2.8.4",
    "ngx-order-pipe": "^2.0.1",
    "ngx-pagination": "^3.2.1",
    "ngx-perfect-scrollbar": "5.0.0-7",
    "ngx-spinner": "^7.0.0",
    "ngx-swiper-wrapper": "^6.4.1",
    "ngx-ui-switch": "^8.0.0",
    "perfect-scrollbar": "^1.3.0",
    "quill": "^1.2.0",
    "rxjs": "^6.2.2",
    "rxjs-compat": "^6.3.3",
    "screenfull": "^3.2.2",
    "simple-line-icons": "^2.4.1",
    "sortablejs": "^1.6.0",
    "tether": "^1.4.0",
    "ts-loader": "^3.5.0",
    "zone.js": "^0.8.14"
  },
  "devDependencies": {
    "@angular/cli": "1.6.5",
    "@angular/compiler-cli": "5.2.0",
    "@types/jasmine": "2.5.52",
    "@types/jquery": "3.2.0",
    "@types/node": "^7.0.8",
    "codelyzer": "3.0.1",
    "jasmine-core": "2.6.3",
    "jasmine-spec-reporter": "4.1.0",
    "karma": "1.7.0",
    "karma-chrome-launcher": "2.1.1",
    "karma-cli": "1.0.1",
    "karma-coverage-istanbul-reporter": "1.3.0",
    "karma-jasmine": "1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "^5.4.1",
    "ts-node": "3.0.6",
    "tslint": "5.4.3",
    "typescript": "2.4.2"
  }
}

webpack.server.config.js 

const path = require('path');
const webpack = require('webpack');
module.exports = {
  entry: { server: './server.ts' },
  resolve: { extensions: ['.js', '.ts'] },
  target: 'node',
  mode: 'none',
  // this makes sure we include node_modules and other 3rd party libraries
  externals: [/node_modules/],
  output: {
    path: path.join(__dirname, 'dist'),
    filename: '[name].js'
  },
  module: {
    rules: [{ test: /\.ts$/, loader: 'ts-loader' }]
  },
  plugins: [
    // Temporary Fix for issue: https://github.com/angular/angular/issues/11580
    // for 'WARNING Critical dependency: the request of a dependency is an expression'
    new webpack.ContextReplacementPlugin(
      /(.+)?angular(\\|\/)core(.+)?/,
      path.join(__dirname, 'src'), // location of your src
      {} // a map of your routes
    ),
    new webpack.ContextReplacementPlugin(
      /(.+)?express(\\|\/)(.+)?/,
      path.join(__dirname, 'src'),
      {}
    )
  ]
};

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');

// 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('*', (req, res) => {
  res.render('index', { req });
});

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

Было бы очень хорошо, если бы кто-нибудь помог мне решить эту проблему.Прошло более 2 часов, и я ничего не могу найти в Google.

...