mirror of https://github.com/abpframework/abp.git
erdemcaygor
1 year ago
12 changed files with 271 additions and 16 deletions
@ -0,0 +1,11 @@ |
|||||
|
import { mergeApplicationConfig, ApplicationConfig } from '@angular/core'; |
||||
|
import { provideServerRendering } from '@angular/ssr'; |
||||
|
import { appConfig } from './app.config'; |
||||
|
|
||||
|
const serverConfig: ApplicationConfig = { |
||||
|
providers: [ |
||||
|
provideServerRendering() |
||||
|
] |
||||
|
}; |
||||
|
|
||||
|
export const config = mergeApplicationConfig(appConfig, serverConfig); |
||||
@ -0,0 +1,7 @@ |
|||||
|
import { bootstrapApplication } from '@angular/platform-browser'; |
||||
|
import { AppComponent } from './app/app.component'; |
||||
|
import { config } from './app/app.config.server'; |
||||
|
|
||||
|
const bootstrap = () => bootstrapApplication(AppComponent, config); |
||||
|
|
||||
|
export default bootstrap; |
||||
@ -0,0 +1,74 @@ |
|||||
|
import 'zone.js/node'; |
||||
|
|
||||
|
import { APP_BASE_HREF } from '@angular/common'; |
||||
|
import { CommonEngine } from '@angular/ssr/node'; |
||||
|
import express from 'express'; |
||||
|
import { existsSync } from 'node:fs'; |
||||
|
import { join } from 'node:path'; |
||||
|
import bootstrap from './main.server'; |
||||
|
|
||||
|
// The Express app is exported so that it can be used by serverless Functions.
|
||||
|
export function app(): express.Express { |
||||
|
const server = express(); |
||||
|
const distFolder = join(process.cwd(), 'dist/MyProjectName/browser'); |
||||
|
const indexHtml = existsSync(join(distFolder, 'index.original.html')) |
||||
|
? join(distFolder, 'index.original.html') |
||||
|
: join(distFolder, 'index.html'); |
||||
|
|
||||
|
const commonEngine = new CommonEngine(); |
||||
|
|
||||
|
server.set('view engine', 'html'); |
||||
|
server.set('views', distFolder); |
||||
|
|
||||
|
// Example Express Rest API endpoints
|
||||
|
// server.get('/api/{*splat}', (req, res) => { });
|
||||
|
// Serve static files from /browser
|
||||
|
server.use(express.static(distFolder, { |
||||
|
maxAge: '1y', |
||||
|
index: false, |
||||
|
})); |
||||
|
|
||||
|
// All regular routes use the Angular engine
|
||||
|
server.use((req, res, next) => { |
||||
|
const { protocol, originalUrl, baseUrl, headers } = req; |
||||
|
|
||||
|
commonEngine |
||||
|
.render({ |
||||
|
bootstrap, |
||||
|
documentFilePath: indexHtml, |
||||
|
url: `${protocol}://${headers.host}${originalUrl}`, |
||||
|
publicPath: distFolder, |
||||
|
providers: [{ provide: APP_BASE_HREF, useValue: baseUrl }], |
||||
|
}) |
||||
|
.then((html) => res.send(html)) |
||||
|
.catch((err) => next(err)); |
||||
|
}); |
||||
|
|
||||
|
return server; |
||||
|
} |
||||
|
|
||||
|
function run(): void { |
||||
|
const port = process.env['PORT'] || 4000; |
||||
|
|
||||
|
// Start up the Node server
|
||||
|
const server = app(); |
||||
|
server.listen(port, (error) => { |
||||
|
if (error) { |
||||
|
throw error; |
||||
|
} |
||||
|
|
||||
|
console.log(`Node Express server listening on http://localhost:${port}`); |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
// Webpack will replace 'require' with '__webpack_require__'
|
||||
|
// '__non_webpack_require__' is a proxy to Node 'require'
|
||||
|
// 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(); |
||||
|
} |
||||
|
|
||||
|
export default bootstrap; |
||||
@ -0,0 +1,16 @@ |
|||||
|
/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */ |
||||
|
/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */ |
||||
|
{ |
||||
|
"extends": "./tsconfig.app.json", |
||||
|
"compilerOptions": { |
||||
|
"outDir": "./out-tsc/server", |
||||
|
"types": [ |
||||
|
"node", |
||||
|
"@angular/localize" |
||||
|
] |
||||
|
}, |
||||
|
"files": [ |
||||
|
"src/main.server.ts", |
||||
|
"src/server.ts" |
||||
|
] |
||||
|
} |
||||
@ -0,0 +1,69 @@ |
|||||
|
import 'zone.js/node'; |
||||
|
|
||||
|
import { APP_BASE_HREF } from '@angular/common'; |
||||
|
import { CommonEngine } from '@angular/ssr/node'; |
||||
|
import * as express from 'express'; |
||||
|
import { existsSync } from 'node:fs'; |
||||
|
import { join } from 'node:path'; |
||||
|
import bootstrap from './main.server'; |
||||
|
|
||||
|
// The Express app is exported so that it can be used by serverless Functions.
|
||||
|
export function app(): express.Express { |
||||
|
const server = express(); |
||||
|
const distFolder = join(process.cwd(), 'dist/MyProjectName/browser'); |
||||
|
const indexHtml = existsSync(join(distFolder, 'index.original.html')) |
||||
|
? join(distFolder, 'index.original.html') |
||||
|
: join(distFolder, 'index.html'); |
||||
|
|
||||
|
const commonEngine = new CommonEngine(); |
||||
|
|
||||
|
server.set('view engine', 'html'); |
||||
|
server.set('views', distFolder); |
||||
|
|
||||
|
// Example Express Rest API endpoints
|
||||
|
// server.get('/api/**', (req, res) => { });
|
||||
|
// Serve static files from /browser
|
||||
|
server.get('*.*', express.static(distFolder, { |
||||
|
maxAge: '1y' |
||||
|
})); |
||||
|
|
||||
|
// All regular routes use the Angular engine
|
||||
|
server.get('*', (req, res, next) => { |
||||
|
const { protocol, originalUrl, baseUrl, headers } = req; |
||||
|
|
||||
|
commonEngine |
||||
|
.render({ |
||||
|
bootstrap, |
||||
|
documentFilePath: indexHtml, |
||||
|
url: `${protocol}://${headers.host}${originalUrl}`, |
||||
|
publicPath: distFolder, |
||||
|
providers: [{ provide: APP_BASE_HREF, useValue: baseUrl }], |
||||
|
}) |
||||
|
.then((html) => res.send(html)) |
||||
|
.catch((err) => next(err)); |
||||
|
}); |
||||
|
|
||||
|
return server; |
||||
|
} |
||||
|
|
||||
|
function run(): void { |
||||
|
const port = process.env['PORT'] || 4000; |
||||
|
|
||||
|
// Start up the Node server
|
||||
|
const server = app(); |
||||
|
server.listen(port, () => { |
||||
|
console.log(`Node Express server listening on http://localhost:${port}`); |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
// Webpack will replace 'require' with '__webpack_require__'
|
||||
|
// '__non_webpack_require__' is a proxy to Node 'require'
|
||||
|
// 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(); |
||||
|
} |
||||
|
|
||||
|
export default bootstrap; |
||||
Loading…
Reference in new issue