[Monitor Dashboard | Trunk]: Update to angular 11
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-monitor-portal/trunk/monitor_dashboard@61408 d315682c-612b-4755-9ff5-7f18f6832af3pull/1/head
parent
068b23c0c1
commit
3f231e23a0
@ -0,0 +1,11 @@
|
|||||||
|
# This file is currently used by autoprefixer to adjust CSS to support the below specified browsers
|
||||||
|
# For additional information regarding the format and rule options, please see:
|
||||||
|
# https://github.com/browserslist/browserslist#queries
|
||||||
|
#
|
||||||
|
# For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed
|
||||||
|
|
||||||
|
> 0.5%
|
||||||
|
last 2 versions
|
||||||
|
Firefox ESR
|
||||||
|
not dead
|
||||||
|
not IE 9-11
|
||||||
@ -1,54 +1,39 @@
|
|||||||
# Angular Universal & Anguar-CLI minimal starter
|
# Monitor Dashboard
|
||||||
|
|
||||||
> This demo is built following the [Angular-CLI Wiki guide](https://github.com/angular/angular-cli/wiki/stories-universal-rendering)
|
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.3.10 and has been updated to 11.2.14.
|
||||||
|
|
||||||
We're utilizing packages from the [Angular Universal @nguniversal](https://github.com/angular/universal) repo, such as [ng-module-map-ngfactory-loader](https://github.com/angular/universal/tree/master/modules/module-map-ngfactory-loader) to enable Lazy Loading.
|
## Install packages
|
||||||
|
|
||||||
---
|
Run npm install (maybe needs sudo), a script that will delete unused files from library will be run.
|
||||||
|
|
||||||
## Static or Dynamic
|
## Development server
|
||||||
This repo demonstrates the use of 2 different forms of Server Side Rendering.
|
|
||||||
|
|
||||||
**Static** Also known as "prerendering"
|
Run `npm start` for a dev server. Navigate to `http://localhost:4600/dashboard`. The app will automatically reload if you change any of the source files.
|
||||||
* Happens at build time
|
|
||||||
* Renders your application and replaces the dist index.html with a version rendered at the route `/`.
|
|
||||||
|
|
||||||
**Dynamic**
|
## Build - CSR
|
||||||
* Happens at runtime
|
|
||||||
* Uses `ngExpressEngine` to render you application on the fly at the requested url.
|
|
||||||
|
|
||||||
---
|
Use the `npm run build-dev` for a development build.<br>
|
||||||
|
Use the `npm run build-beta` for a beta build.<br>
|
||||||
|
Use the `npm run build-prod` for a production build.
|
||||||
|
|
||||||
## Installation
|
## Build - SSR
|
||||||
* `npm install` or `yarn`
|
|
||||||
|
|
||||||
---
|
Use the `npm run build:ssr-dev` for a development build.<br>
|
||||||
|
Use the `npm run build:ssr-beta` for a beta build.<br>
|
||||||
|
Use the `npm run build:ssr-prod` for a production build.
|
||||||
|
|
||||||
## Development (Client-side only rendering)
|
## Run SSR
|
||||||
* run `npm run start` which will start `ng serve` (project served at the standard: localhost:4200)
|
|
||||||
|
|
||||||
---
|
`npm run serve:ssr` will run the last server build.
|
||||||
|
|
||||||
## Production
|
## Webpack Analyzer
|
||||||
|
|
||||||
Depending on whether you're publishing dynamic or static prerendering, run the build command, and then serve up your dist folder assets.
|
In order to analyze bundle size you can run `npm run webpack-bundle-analyzer`
|
||||||
|
|
||||||
> **NOTE**: To deploy your **Static** site to a static hosting platform you will have to deploy the *`dist/browser`* folder, rather than the usual *`dist`*
|
## Running unit tests
|
||||||
|
|
||||||
ie: `npm run build:dynamic` or `npm run build:static`. All of the files that need to be served will be found within the `/dist` folder.
|
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## Testing Universal (dynamic or static) builds -Locally-
|
|
||||||
|
|
||||||
**Dynamic** : **`npm run start:dynamic`**
|
|
||||||
|
|
||||||
Compiles your application and spins up a Node Express to dynamically serve your Universal application on `http://localhost:4000`.
|
|
||||||
|
|
||||||
**Static** : **`npm run start:static`**
|
|
||||||
|
|
||||||
- Compiles your application and prerenders your applications files, spinning up a demo http-server so you can view it on `http://127.0.0.1:8080`
|
|
||||||
|
|
||||||
|
## Running end-to-end tests
|
||||||
|
|
||||||
|
Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
|
||||||
|
|||||||
@ -0,0 +1,3 @@
|
|||||||
|
cd src/app/openaireLibrary
|
||||||
|
cd ../../../
|
||||||
|
echo "Done"
|
||||||
@ -0,0 +1,28 @@
|
|||||||
|
// Protractor configuration file, see link for more information
|
||||||
|
// https://github.com/angular/protractor/blob/master/lib/config.ts
|
||||||
|
|
||||||
|
const { SpecReporter } = require('jasmine-spec-reporter');
|
||||||
|
|
||||||
|
exports.config = {
|
||||||
|
allScriptsTimeout: 11000,
|
||||||
|
specs: [
|
||||||
|
'./src/**/*.e2e-spec.ts'
|
||||||
|
],
|
||||||
|
capabilities: {
|
||||||
|
'browserName': 'chrome'
|
||||||
|
},
|
||||||
|
directConnect: true,
|
||||||
|
baseUrl: 'http://localhost:4200/',
|
||||||
|
framework: 'jasmine',
|
||||||
|
jasmineNodeOpts: {
|
||||||
|
showColors: true,
|
||||||
|
defaultTimeoutInterval: 30000,
|
||||||
|
print: function() {}
|
||||||
|
},
|
||||||
|
onPrepare() {
|
||||||
|
require('ts-node').register({
|
||||||
|
project: require('path').join(__dirname, './tsconfig.e2e.json')
|
||||||
|
});
|
||||||
|
jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
|
||||||
|
}
|
||||||
|
};
|
||||||
@ -0,0 +1,23 @@
|
|||||||
|
import { AppPage } from './app.po';
|
||||||
|
import { browser, logging } from 'protractor';
|
||||||
|
|
||||||
|
describe('workspace-project App', () => {
|
||||||
|
let page: AppPage;
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
page = new AppPage();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should display welcome message', () => {
|
||||||
|
page.navigateTo();
|
||||||
|
expect(page.getTitleText()).toEqual('Welcome to monitor-dashboard!');
|
||||||
|
});
|
||||||
|
|
||||||
|
afterEach(async () => {
|
||||||
|
// Assert that there are no errors emitted from the browser
|
||||||
|
const logs = await browser.manage().logs().get(logging.Type.BROWSER);
|
||||||
|
expect(logs).not.toContain(jasmine.objectContaining({
|
||||||
|
level: logging.Level.SEVERE,
|
||||||
|
} as logging.Entry));
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,11 @@
|
|||||||
|
import { browser, by, element } from 'protractor';
|
||||||
|
|
||||||
|
export class AppPage {
|
||||||
|
navigateTo() {
|
||||||
|
return browser.get(browser.baseUrl) as Promise<any>;
|
||||||
|
}
|
||||||
|
|
||||||
|
getTitleText() {
|
||||||
|
return element(by.css('app-root h1')).getText() as Promise<string>;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,13 @@
|
|||||||
|
{
|
||||||
|
"extends": "../tsconfig.json",
|
||||||
|
"compilerOptions": {
|
||||||
|
"outDir": "../out-tsc/app",
|
||||||
|
"module": "commonjs",
|
||||||
|
"target": "es5",
|
||||||
|
"types": [
|
||||||
|
"jasmine",
|
||||||
|
"jasminewd2",
|
||||||
|
"node"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -1,79 +1,72 @@
|
|||||||
{
|
{
|
||||||
"name": "openaire-monitor",
|
"name": "monitor-dashboard",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"license": "Openaire",
|
|
||||||
"contributors": [
|
|
||||||
"Argiro Kokogiannaki <argirok@di.uoa.gr>",
|
|
||||||
"Konstantina Galouni <kgalouni@di.uoa.gr>"
|
|
||||||
],
|
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"ng": "ng",
|
"ng": "ng",
|
||||||
"start": " ng serve --port 4600 --disable-host-check --host 0.0.0.0 --base-href /dashboard/",
|
"start": "ng serve --port 4600 --disable-host-check --host 0.0.0.0",
|
||||||
"start:ssr": "npm run build:ssr && npm run serve:ssr",
|
|
||||||
"start:prerender": "npm run build:prerender && npm run serve:prerender",
|
|
||||||
"start:ssr-beta": "npm run build:ssr-beta && npm run serve:ssr",
|
|
||||||
"start:prerender-beta": "npm run build:prerender-beta && npm run serve:prerender",
|
|
||||||
"start:ssr-dev": "npm run build:ssr-dev && npm run serve:ssr",
|
|
||||||
"start:prerender-dev": "npm run build:prerender-dev && npm run serve:prerender",
|
|
||||||
"build": "ng build",
|
"build": "ng build",
|
||||||
"build:client-and-server-bundles": "ng build --prod --sourceMap --stats-json=true --base-href /dashboard/ && ng run ng-universal-demo:server:production",
|
"build-dev": "ng build --configuration=development --source-map --base-href /dashboard/",
|
||||||
"build:client-and-server-bundles-beta": "ng build --configuration=beta --sourceMap --stats-json=true --base-href /dashboard/ && ng run ng-universal-demo:server:beta",
|
"build-beta": "ng build --configuration=beta --base-href /dashboard/ --source-map",
|
||||||
"build:client-and-server-bundles-dev": "ng build --configuration=development --sourceMap --stats-json=true && ng run ng-universal-demo:server:development",
|
"build-prod": "ng build --prod --base-href /dashboard/ --sourceMap ",
|
||||||
"build:prerender": "npm run build:client-and-server-bundles && npm run webpack:server && npm run generate:prerender",
|
"webpack-bundle-analyzer": "ng build --stats-json && webpack-bundle-analyzer dist/monitor-dashboard/browser/stats.json --host 0.0.0.0",
|
||||||
"build:ssr": "npm run build:client-and-server-bundles && npm run webpack:server",
|
"test": "ng test",
|
||||||
"build:prerender-beta": "npm run build:client-and-server-bundles-beta && npm run webpack:server && npm run generate:prerender",
|
"e2e": "ng e2e",
|
||||||
"build:ssr-beta": "npm run build:client-and-server-bundles-beta && npm run webpack:server",
|
"dev:ssr": "ng run monitor-dashboard:serve-ssr",
|
||||||
"build:prerender-dev": "npm run build:client-and-server-bundles-dev && npm run webpack:server && npm run generate:prerender",
|
"serve:ssr": "node dist/monitor-dashboard/server/main.js",
|
||||||
"build:ssr-dev": "npm run build:client-and-server-bundles-dev && npm run webpack:server",
|
"build:ssr-dev": "npm run build-dev && ng run monitor-dashboard:server:development",
|
||||||
"generate:prerender": "cd dist && node prerender",
|
"build:ssr-beta": "npm run build-beta && ng run monitor-dashboard:server:beta",
|
||||||
"webpack:server": "webpack --config webpack.server.config.js --progress --colors",
|
"build:ssr-prod": "npm run build-prod && ng run monitor-dashboard:server:production",
|
||||||
"serve:prerender": "cd dist/browser && http-server",
|
"prerender": "ng run monitor-dashboard:prerender",
|
||||||
"serve:ssr": "node dist/server",
|
"postinstall": "chmod +x clean-library.sh && ./clean-library.sh",
|
||||||
"after-build-clean": "rm -rf src node_modules .idea/ installOpenaireLib.sh deploy dist/browser/assets/common-assets/.svn/ dist/browser/stats.json ; "
|
"after-build-clean": "rm -rf dist/monitor-dashboard/browser/assets/common-assets/.svn/ src/app/openaireLibrary/.svn node_modules src/assets/common-assets/.svn/"
|
||||||
},
|
},
|
||||||
"private": true,
|
"private": true,
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@angular/animations": "^7.2.14",
|
"@angular/animations": "~11.2.14",
|
||||||
"@angular/cdk": "^7.3.7",
|
"@angular/cdk": "^11.2.13",
|
||||||
"@angular/common": "7.2.14",
|
"@angular/common": "~11.2.14",
|
||||||
"@angular/compiler": "7.2.14",
|
"@angular/compiler": "~11.2.14",
|
||||||
"@angular/core": "7.2.14",
|
"@angular/core": "~11.2.14",
|
||||||
"@angular/forms": "7.2.14",
|
"@angular/forms": "~11.2.14",
|
||||||
"@angular/http": "7.2.14",
|
"@angular/localize": "^11.2.14",
|
||||||
"@angular/material": "^7.3.7",
|
"@angular/material": "^11.2.13",
|
||||||
"@angular/platform-browser": "7.2.14",
|
"@angular/platform-browser": "~11.2.14",
|
||||||
"@angular/platform-browser-dynamic": "7.2.14",
|
"@angular/platform-browser-dynamic": "~11.2.14",
|
||||||
"@angular/platform-server": "7.2.14",
|
"@angular/platform-server": "~11.2.14",
|
||||||
"@angular/router": "7.2.14",
|
"@angular/router": "~11.2.14",
|
||||||
"@nguniversal/express-engine": "^6.0.0",
|
"@nguniversal/express-engine": "^11.2.1",
|
||||||
"@nguniversal/module-map-ngfactory-loader": "^6.0.0",
|
|
||||||
"@types/express": "^4.16.1",
|
|
||||||
"clipboard": "^1.5.16",
|
"clipboard": "^1.5.16",
|
||||||
"core-js": "^2.4.1",
|
"core-js": "^2.5.4",
|
||||||
|
"express": "^4.15.2",
|
||||||
"jquery": "^3.4.1",
|
"jquery": "^3.4.1",
|
||||||
"ng-recaptcha": "^3.0.5",
|
"ng-recaptcha": "^7.0.1",
|
||||||
"ng2-ckeditor": "1.1.9",
|
"ng2-ckeditor": "1.3.1",
|
||||||
"ngx-json-ld": "0.1.6",
|
"rxjs": "^6.5.1",
|
||||||
"nouislider": "^14.6.0",
|
|
||||||
"prom-client": "^11.3.0",
|
|
||||||
"ts-md5": "^1.2.0",
|
"ts-md5": "^1.2.0",
|
||||||
"tslib": "^1.9.0",
|
"tslib": "^2.0.0",
|
||||||
"zone.js": "^0.8.26"
|
"zone.js": "~0.10.2"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@angular-devkit/build-angular": "~0.13.0",
|
"@angular-devkit/build-angular": "~0.1102.14",
|
||||||
"@angular/cli": "^7.3.9",
|
"@angular/cli": "~11.2.14",
|
||||||
"@angular/compiler-cli": "7.2.14",
|
"@angular/compiler-cli": "~11.2.14",
|
||||||
"@angular/language-service": "7.2.14",
|
"@angular/language-service": "~11.2.14",
|
||||||
"@types/jquery": "^3.3.29",
|
"@nguniversal/builders": "^11.2.1",
|
||||||
"@types/node": "^8.0.30",
|
"@types/express": "^4.17.0",
|
||||||
"cpy-cli": "^1.0.1",
|
"@types/compression": "^1.7.0",
|
||||||
"http-server": "^0.10.0",
|
"@types/node": "^12.11.1",
|
||||||
"reflect-metadata": "^0.1.10",
|
"@types/jasmine": "~3.6.0",
|
||||||
"rxjs": "6.5.1",
|
"@types/jasminewd2": "~2.0.3",
|
||||||
"rxjs-compat": "^6.5.1",
|
"codelyzer": "^6.0.0",
|
||||||
"ts-loader": "^4.2.0",
|
"jasmine-core": "~3.8.0",
|
||||||
"typescript": "3.2.4",
|
"jasmine-spec-reporter": "~5.0.0",
|
||||||
"webpack-cli": "^3.3.2"
|
"karma": "~6.3.3",
|
||||||
|
"karma-chrome-launcher": "~3.1.0",
|
||||||
|
"karma-coverage-istanbul-reporter": "~3.0.2",
|
||||||
|
"karma-jasmine": "~4.0.0",
|
||||||
|
"karma-jasmine-html-reporter": "^1.6.0",
|
||||||
|
"protractor": "~7.0.0",
|
||||||
|
"ts-node": "~7.0.0",
|
||||||
|
"typescript": "~4.0.7"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,45 +0,0 @@
|
|||||||
// Load zone.js for the server.
|
|
||||||
import 'zone.js/dist/zone-node';
|
|
||||||
import 'reflect-metadata';
|
|
||||||
import { readFileSync, writeFileSync, existsSync, mkdirSync } from 'fs';
|
|
||||||
import { join } from 'path';
|
|
||||||
|
|
||||||
import { enableProdMode } from '@angular/core';
|
|
||||||
// Faster server renders w/ Prod mode (dev mode never needed)
|
|
||||||
enableProdMode();
|
|
||||||
|
|
||||||
// Express Engine
|
|
||||||
import { ngExpressEngine } from '@nguniversal/express-engine';
|
|
||||||
// Import module map for lazy loading
|
|
||||||
import { provideModuleMap } from '@nguniversal/module-map-ngfactory-loader';
|
|
||||||
import { renderModuleFactory } from '@angular/platform-server';
|
|
||||||
import { ROUTES } from './static.paths';
|
|
||||||
|
|
||||||
// * NOTE :: leave this as require() since this file is built Dynamically from webpack
|
|
||||||
const { AppServerModuleNgFactory, LAZY_MODULE_MAP } = require('./dist/server/main');
|
|
||||||
|
|
||||||
const BROWSER_FOLDER = join(process.cwd(), 'browser');
|
|
||||||
|
|
||||||
// Load the index.html file containing referances to your application bundle.
|
|
||||||
const index = readFileSync(join('browser', 'index.html'), 'utf8');
|
|
||||||
|
|
||||||
let previousRender = Promise.resolve();
|
|
||||||
|
|
||||||
// Iterate each route path
|
|
||||||
ROUTES.forEach(route => {
|
|
||||||
const fullPath = join(BROWSER_FOLDER, route);
|
|
||||||
|
|
||||||
// Make sure the directory structure is there
|
|
||||||
if(!existsSync(fullPath)){
|
|
||||||
mkdirSync(fullPath);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Writes rendered HTML to index.html, replacing the file if it already exists.
|
|
||||||
previousRender = previousRender.then(_ => renderModuleFactory(AppServerModuleNgFactory, {
|
|
||||||
document: index,
|
|
||||||
url: route,
|
|
||||||
extraProviders: [
|
|
||||||
provideModuleMap(LAZY_MODULE_MAP)
|
|
||||||
]
|
|
||||||
})).then(html => writeFileSync(join(fullPath, 'index.html'), html));
|
|
||||||
});
|
|
||||||
@ -1,82 +1,77 @@
|
|||||||
import 'zone.js/dist/zone-node';
|
import 'zone.js/dist/zone-node';
|
||||||
import 'reflect-metadata';
|
|
||||||
import { renderModuleFactory } from '@angular/platform-server';
|
|
||||||
import { enableProdMode } from '@angular/core';
|
|
||||||
|
|
||||||
|
import { ngExpressEngine } from '@nguniversal/express-engine';
|
||||||
import * as express from 'express';
|
import * as express from 'express';
|
||||||
|
import * as compression from 'compression';
|
||||||
import { join } from 'path';
|
import { join } from 'path';
|
||||||
import { readFileSync } from 'fs';
|
|
||||||
|
|
||||||
// Faster server renders w/ Prod mode (dev mode never needed)
|
import { AppServerModule } from './src/main.server';
|
||||||
enableProdMode();
|
import { APP_BASE_HREF } from '@angular/common';
|
||||||
|
import { existsSync } from 'fs';
|
||||||
|
import {REQUEST, RESPONSE} from "./src/app/openaireLibrary/utils/tokens";
|
||||||
|
|
||||||
// Express server
|
// The Express app is exported so that it can be used by serverless Functions.
|
||||||
const app = express();
|
export function app() {
|
||||||
|
const server = express();
|
||||||
|
server.use(compression());
|
||||||
|
const distFolder = join(process.cwd(), 'dist/monitor-dashboard/browser');
|
||||||
|
const indexHtml = existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';
|
||||||
|
|
||||||
const PORT = 4000;
|
// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
|
||||||
const DIST_FOLDER = join(process.cwd(), 'dist');
|
server.engine('html', ngExpressEngine({
|
||||||
|
bootstrap: AppServerModule,
|
||||||
|
}));
|
||||||
|
|
||||||
// Our index.html we'll use as our template
|
server.set('view engine', 'html');
|
||||||
const template = readFileSync(join(DIST_FOLDER, 'browser', 'index.html')).toString();
|
server.set('views', distFolder);
|
||||||
|
|
||||||
// * NOTE :: leave this as require() since this file is built Dynamically from webpack
|
// Example Express Rest API endpoints
|
||||||
const { AppServerModuleNgFactory, LAZY_MODULE_MAP } = require('./dist/server/main');
|
// server.get('/api/**', (req, res) => { });
|
||||||
|
// Serve static files from /browser
|
||||||
|
server.get('*.*', express.static(distFolder, {
|
||||||
|
maxAge: '1y'
|
||||||
|
}));
|
||||||
|
|
||||||
// Express Engine
|
// All regular routes use the Universal engine
|
||||||
import {ngExpressEngine, RenderOptions} from '@nguniversal/express-engine';
|
server.get('*', (req, res) => {
|
||||||
// Import module map for lazy loading
|
res.render(indexHtml, {
|
||||||
import { provideModuleMap } from '@nguniversal/module-map-ngfactory-loader';
|
req, providers: [
|
||||||
import {REQUEST, RESPONSE} from "@nguniversal/express-engine/tokens";
|
{
|
||||||
|
provide: APP_BASE_HREF,
|
||||||
// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
|
useValue: req.baseUrl
|
||||||
// app.engine('html', ngExpressEngine({
|
},
|
||||||
// bootstrap: AppServerModuleNgFactory,
|
{
|
||||||
// providers: [
|
provide: REQUEST, useValue: (req)
|
||||||
// { provide: 'request', useFactory: () => options.req, deps: [] },
|
},
|
||||||
// provideModuleMap(LAZY_MODULE_MAP)
|
{
|
||||||
// ]
|
provide: RESPONSE, useValue: (res)
|
||||||
// }));
|
}
|
||||||
|
]
|
||||||
// be able to get request and get domain from there
|
}
|
||||||
app.engine('html', (_, options: any, callback) => {
|
|
||||||
const opts = {
|
|
||||||
document: template,
|
|
||||||
url: options.req.url,
|
|
||||||
extraProviders: [
|
|
||||||
provideModuleMap(LAZY_MODULE_MAP),
|
|
||||||
{
|
|
||||||
provide: REQUEST,
|
|
||||||
useValue: options.req
|
|
||||||
},
|
|
||||||
{
|
|
||||||
provide: RESPONSE,
|
|
||||||
useValue: options.req.res,
|
|
||||||
},
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
renderModuleFactory(AppServerModuleNgFactory, opts)
|
|
||||||
.then(html => callback(null, html)
|
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
app.set('view engine', 'html');
|
|
||||||
app.set('views', join(DIST_FOLDER, 'browser'));
|
return server;
|
||||||
|
}
|
||||||
|
|
||||||
/* - Example Express Rest API endpoints -
|
function run() {
|
||||||
app.get('/api/**', (req, res) => { });
|
const port = process.env.PORT || 4000;
|
||||||
*/
|
|
||||||
|
|
||||||
// Server static files from /browser
|
// Start up the Node server
|
||||||
app.get('*.*', express.static(join(DIST_FOLDER, 'browser'), {
|
const server = app();
|
||||||
maxAge: '1y'
|
server.listen(port, () => {
|
||||||
}));
|
console.log(`Node Express server listening on http://localhost:${port}`);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
// ALl regular routes use the Universal engine
|
// Webpack will replace 'require' with '__webpack_require__'
|
||||||
app.get('*', (req, res) => {
|
// '__non_webpack_require__' is a proxy to Node 'require'
|
||||||
res.render('index', { req });
|
// The below code is to ensure that the server is run only when not requiring the bundle.
|
||||||
});
|
declare const __non_webpack_require__: NodeRequire;
|
||||||
|
const mainModule = __non_webpack_require__.main;
|
||||||
|
const moduleFilename = mainModule && mainModule.filename || '';
|
||||||
|
if (moduleFilename === __filename || moduleFilename.includes('iisnode')) {
|
||||||
|
run();
|
||||||
|
}
|
||||||
|
|
||||||
// Start up the Node server
|
export * from './src/main.server';
|
||||||
app.listen(PORT, () => {
|
|
||||||
console.log(`Node Express server listening on http://localhost:${PORT}`);
|
|
||||||
});
|
|
||||||
|
|||||||
@ -1,20 +1,14 @@
|
|||||||
import {NgModule} from '@angular/core';
|
import { NgModule } from '@angular/core';
|
||||||
import {ServerModule} from '@angular/platform-server';
|
import { ServerModule } from '@angular/platform-server';
|
||||||
import {ModuleMapLoaderModule} from '@nguniversal/module-map-ngfactory-loader';
|
|
||||||
|
|
||||||
import {AppModule} from './app.module';
|
import { AppModule } from './app.module';
|
||||||
import {AppComponent} from './app.component';
|
import { AppComponent } from './app.component';
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [
|
imports: [
|
||||||
// The AppServerModule should import your AppModule followed
|
|
||||||
// by the ServerModule from @angular/platform-server.
|
|
||||||
AppModule,
|
AppModule,
|
||||||
ServerModule,
|
ServerModule,
|
||||||
ModuleMapLoaderModule,
|
|
||||||
],
|
],
|
||||||
// Since the bootstrapped component is not inherited from your
|
|
||||||
// imported AppModule, it needs to be repeated here.
|
|
||||||
bootstrap: [AppComponent],
|
bootstrap: [AppComponent],
|
||||||
})
|
})
|
||||||
export class AppServerModule {}
|
export class AppServerModule {}
|
||||||
|
|||||||
@ -0,0 +1,32 @@
|
|||||||
|
// Karma configuration file, see link for more information
|
||||||
|
// https://karma-runner.github.io/1.0/config/configuration-file.html
|
||||||
|
|
||||||
|
module.exports = function (config) {
|
||||||
|
config.set({
|
||||||
|
basePath: '',
|
||||||
|
frameworks: ['jasmine', '@angular-devkit/build-angular'],
|
||||||
|
plugins: [
|
||||||
|
require('karma-jasmine'),
|
||||||
|
require('karma-chrome-launcher'),
|
||||||
|
require('karma-jasmine-html-reporter'),
|
||||||
|
require('karma-coverage-istanbul-reporter'),
|
||||||
|
require('@angular-devkit/build-angular/plugins/karma')
|
||||||
|
],
|
||||||
|
client: {
|
||||||
|
clearContext: false // leave Jasmine Spec Runner output visible in browser
|
||||||
|
},
|
||||||
|
coverageIstanbulReporter: {
|
||||||
|
dir: require('path').join(__dirname, '../coverage/monitor-dashboard'),
|
||||||
|
reports: ['html', 'lcovonly', 'text-summary'],
|
||||||
|
fixWebpackSourcePaths: true
|
||||||
|
},
|
||||||
|
reporters: ['progress', 'kjhtml'],
|
||||||
|
port: 9876,
|
||||||
|
colors: true,
|
||||||
|
logLevel: config.LOG_INFO,
|
||||||
|
autoWatch: true,
|
||||||
|
browsers: ['Chrome'],
|
||||||
|
singleRun: false,
|
||||||
|
restartOnFileChange: true
|
||||||
|
});
|
||||||
|
};
|
||||||
@ -1 +1,15 @@
|
|||||||
|
/***************************************************************************************************
|
||||||
|
* Load `$localize` onto the global scope - used if i18n tags appear in Angular templates.
|
||||||
|
*/
|
||||||
|
import '@angular/localize/init';
|
||||||
|
|
||||||
|
import {enableProdMode} from '@angular/core';
|
||||||
|
|
||||||
|
import {properties} from './environments/environment';
|
||||||
|
|
||||||
|
if (properties.environment !== "development") {
|
||||||
|
enableProdMode();
|
||||||
|
}
|
||||||
|
|
||||||
export { AppServerModule } from './app/app.server.module';
|
export { AppServerModule } from './app/app.server.module';
|
||||||
|
export { renderModule, renderModuleFactory } from '@angular/platform-server';
|
||||||
|
|||||||
@ -0,0 +1,20 @@
|
|||||||
|
// This file is required by karma.conf.js and loads recursively all the .spec and framework files
|
||||||
|
|
||||||
|
import 'zone.js/dist/zone-testing';
|
||||||
|
import { getTestBed } from '@angular/core/testing';
|
||||||
|
import {
|
||||||
|
BrowserDynamicTestingModule,
|
||||||
|
platformBrowserDynamicTesting
|
||||||
|
} from '@angular/platform-browser-dynamic/testing';
|
||||||
|
|
||||||
|
declare const require: any;
|
||||||
|
|
||||||
|
// First, initialize the Angular testing environment.
|
||||||
|
getTestBed().initTestEnvironment(
|
||||||
|
BrowserDynamicTestingModule,
|
||||||
|
platformBrowserDynamicTesting()
|
||||||
|
);
|
||||||
|
// Then we find all the tests.
|
||||||
|
const context = require.context('./', true, /\.spec\.ts$/);
|
||||||
|
// And load the modules.
|
||||||
|
context.keys().map(context);
|
||||||
@ -1,21 +1,17 @@
|
|||||||
{
|
{
|
||||||
"extends": "../tsconfig.json",
|
"extends": "./tsconfig.app.json",
|
||||||
"compilerOptions": {
|
"compilerOptions": {
|
||||||
"outDir": "../out-tsc/app",
|
"outDir": "../out-tsc/app-server",
|
||||||
"baseUrl": "./",
|
"target": "es2016",
|
||||||
// Set the module format to "commonjs":
|
|
||||||
"module": "commonjs",
|
|
||||||
"types": [
|
"types": [
|
||||||
"node"
|
"node"
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"exclude": [
|
"files": [
|
||||||
"test.ts",
|
"main.server.ts",
|
||||||
"**/*.spec.ts"
|
"../server.ts"
|
||||||
],
|
],
|
||||||
// Add "angularCompilerOptions" with the AppServerModule you wrote
|
|
||||||
// set as the "entryModule".
|
|
||||||
"angularCompilerOptions": {
|
"angularCompilerOptions": {
|
||||||
"entryModule": "app/app.server.module#AppServerModule"
|
"entryModule": "./app/app.server.module#AppServerModule"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -0,0 +1,18 @@
|
|||||||
|
{
|
||||||
|
"extends": "../tsconfig.json",
|
||||||
|
"compilerOptions": {
|
||||||
|
"outDir": "../out-tsc/spec",
|
||||||
|
"types": [
|
||||||
|
"jasmine",
|
||||||
|
"node"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"files": [
|
||||||
|
"test.ts",
|
||||||
|
"polyfills.ts"
|
||||||
|
],
|
||||||
|
"include": [
|
||||||
|
"**/*.spec.ts",
|
||||||
|
"**/*.d.ts"
|
||||||
|
]
|
||||||
|
}
|
||||||
@ -1,15 +0,0 @@
|
|||||||
export const ROUTES = [
|
|
||||||
'/',
|
|
||||||
'/lazy',
|
|
||||||
'/home',
|
|
||||||
'/search/publication','/search/other','/search/project','/search/dataset','/search/dataprovider','/search/organization',
|
|
||||||
'/search/find',
|
|
||||||
'/search/person','/search/publication','/search/project','/search/dataset','/search/dataprovider','/search/organization',
|
|
||||||
'/search/find/people','/search/find/publications','/search/find/other','/search/find/projects','/search/find/datasets','/search/find/dataproviders','/search/find/organizations',
|
|
||||||
'/search/advanced/people','/search/advanced/publications','/search/advanced/other','/search/advanced/projects','/search/advanced/datasets','/search/advanced/dataproviders','/search/advanced/organizations',
|
|
||||||
'/participate/deposit-publications','/participate/deposit-datasets','/participate/deposit-publications-result','/participate/deposit-datasets-result','/participate/deposit-subject-result',
|
|
||||||
'/search/content-providers','/search/content-providers-table','/search/entity-registries','/search/entity-registries-table','/search/journals','/search/journals-table',
|
|
||||||
'/project-report','/claims','/myclaims','/participate/claim','/participate/direct-claim','/claims-project-manager',
|
|
||||||
'/test','/user-info',
|
|
||||||
'/error', '/*path'
|
|
||||||
];
|
|
||||||
@ -1,22 +1,23 @@
|
|||||||
{
|
{
|
||||||
"compileOnSave": false,
|
"compileOnSave": false,
|
||||||
"compilerOptions": {
|
"compilerOptions": {
|
||||||
"importHelpers": true,
|
"baseUrl": "./",
|
||||||
|
"downlevelIteration": true,
|
||||||
"outDir": "./dist/out-tsc",
|
"outDir": "./dist/out-tsc",
|
||||||
"sourceMap": true,
|
"sourceMap": true,
|
||||||
"declaration": false,
|
"declaration": false,
|
||||||
|
"module": "es2020",
|
||||||
"moduleResolution": "node",
|
"moduleResolution": "node",
|
||||||
"emitDecoratorMetadata": true,
|
"emitDecoratorMetadata": true,
|
||||||
"experimentalDecorators": true,
|
"experimentalDecorators": true,
|
||||||
"target": "es5",
|
"importHelpers": true,
|
||||||
|
"target": "es2015",
|
||||||
"typeRoots": [
|
"typeRoots": [
|
||||||
"node_modules/@types"
|
"node_modules/@types"
|
||||||
],
|
],
|
||||||
"lib": [
|
"lib": [
|
||||||
"es2017",
|
"es2018",
|
||||||
"dom"
|
"dom"
|
||||||
],
|
]
|
||||||
"module": "es2015",
|
|
||||||
"baseUrl": "./"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,51 +0,0 @@
|
|||||||
// Work around for https://github.com/angular/angular-cli/issues/7200
|
|
||||||
|
|
||||||
const path = require('path');
|
|
||||||
const webpack = require('webpack');
|
|
||||||
|
|
||||||
module.exports = {
|
|
||||||
//mode: 'none',
|
|
||||||
entry: {
|
|
||||||
// This is our Express server for Dynamic universal
|
|
||||||
server: './server.ts',
|
|
||||||
// This is an example of Static prerendering (generative)
|
|
||||||
prerender: './prerender.ts'
|
|
||||||
},
|
|
||||||
target: 'node',
|
|
||||||
resolve: { extensions: ['.ts', '.js'] },
|
|
||||||
// Make sure we include all node_modules etc
|
|
||||||
externals: [/(node_modules|main\..*\.js)/,],
|
|
||||||
optimization: {
|
|
||||||
minimize: false
|
|
||||||
},
|
|
||||||
output: {
|
|
||||||
// Puts the output at the root of the dist folder
|
|
||||||
path: path.join(__dirname, 'dist'),
|
|
||||||
filename: '[name].js'
|
|
||||||
},
|
|
||||||
module: {
|
|
||||||
rules: [
|
|
||||||
{ test: /\.ts$/, loader: 'ts-loader' }
|
|
||||||
,{
|
|
||||||
// Mark files inside `@angular/core` as using SystemJS style dynamic imports.
|
|
||||||
// Removing this will cause deprecation warnings to appear.
|
|
||||||
test: /(\\|\/)@angular(\\|\/)core(\\|\/).+\.js$/,
|
|
||||||
parser: { system: true },
|
|
||||||
},
|
|
||||||
]
|
|
||||||
},
|
|
||||||
plugins: [
|
|
||||||
new webpack.ContextReplacementPlugin(
|
|
||||||
// fixes WARNING Critical dependency: the request of a dependency is an expression
|
|
||||||
/(.+)?angular(\\|\/)core(.+)?/,
|
|
||||||
path.join(__dirname, 'src'), // location of your src
|
|
||||||
{} // a map of your routes
|
|
||||||
),
|
|
||||||
new webpack.ContextReplacementPlugin(
|
|
||||||
// fixes WARNING Critical dependency: the request of a dependency is an expression
|
|
||||||
/(.+)?express(\\|\/)(.+)?/,
|
|
||||||
path.join(__dirname, 'src'),
|
|
||||||
{}
|
|
||||||
)
|
|
||||||
]
|
|
||||||
}
|
|
||||||
Loading…
Reference in New Issue