diff --git a/angular.json b/angular.json index 51b1925fb3..db2949094d 100644 --- a/angular.json +++ b/angular.json @@ -39,7 +39,12 @@ "node_modules" ] }, - "browser": "src/main.ts" + "browser": "src/main.ts", + "server": "src/main.server.ts", + "outputMode": "static", + "ssr": { + "entry": "src/server.ts" + } }, "configurations": { "production": { @@ -159,7 +164,12 @@ ] }, "preserveSymlinks": true, - "browser": "projects/app-lob/src/main.ts" + "browser": "projects/app-lob/src/main.ts", + "server": "projects/app-lob/src/main.server.ts", + "outputMode": "static", + "ssr": { + "entry": "projects/app-lob/src/server.ts" + } }, "configurations": { "production": { @@ -284,7 +294,12 @@ "node_modules" ] }, - "browser": "projects/app-crm/src/main.ts" + "browser": "projects/app-crm/src/main.ts", + "server": "projects/app-crm/src/main.server.ts", + "outputMode": "static", + "ssr": { + "entry": "projects/app-crm/src/server.ts" + } }, "configurations": { "production": { diff --git a/gulpfile.js b/gulpfile.js index c91f022430..ba4d4357f7 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -63,66 +63,6 @@ gulp.task("overwrite-package-json", (done) => { done(); }); -const createPrependerdLobStructure = (cb) => { - const folders = [ - './dist/app-lob/samples', - './dist/app-lob/samples/grid', - './dist/app-lob/samples/tree-grid', - './dist/app-lob/samples/grid-finjs-dock-manager', - './dist/app-lob/samples/hierarchical-grid', - './dist/app-lob/grid', - './dist/app-lob/tree-grid', - './dist/app-lob/grid-finjs-dock-manager', - './dist/app-lob/hierarchical-grid' - ]; - folders.forEach(dir => { - if (!fs.existsSync(dir)) { - fs.mkdirSync(dir); - } - }); - cb(); -} - -const addPrerenderedLobPages = (cb) => { - const { metadata } = require('./projects/app-lob/src/app/metadata'); - const indexFilePath = path.resolve(__dirname, './', 'dist/app-lob/browser', 'index.html'); - - // read in the index.html file - fs.readFile(indexFilePath, 'utf8', function (err, data) { - if (err) { - return console.error(err); - } - - metadata.forEach(({ url, title, description, og_url, folder }) => { - let result = data; - result = result.replace(/\$OG_TITLE/g, title); - result = result.replace(/\$OG_DESCRIPTION/g, description); - result = result.replace(/\$OG_URL/g, og_url); - - let filename = url.substring(1).replace(/\//g, '-'); - if (filename.length) { - filename = filename + '.html'; - } else { - filename = 'index.html'; - } - - fs.writeFile(path.resolve(__dirname, './', './dist/app-lob/samples/' + folder, filename), result, (err) => { - if (err) { - console.log(err); - } - }); - fs.writeFile(path.resolve(__dirname, './', './dist/app-lob/' + folder, filename), result, (err) => { - if (err) { - console.log(err); - } - }); - }) - }) - cb(); -} - -exports.prerenderPages = gulp.series(createPrependerdLobStructure, addPrerenderedLobPages); - gulp.task("watch-live-editing", gulp.series("generate-live-editing", () => { gulp.watch(["./src/**/*.*", "!./src/assets/**", "./live-editing/**/*.*", "package.json"], function () { Object.keys(require.cache).forEach(function (key) { diff --git a/package.json b/package.json index 5053a08d95..3c7b55674c 100644 --- a/package.json +++ b/package.json @@ -16,7 +16,7 @@ "watch-live-editing": "gulp watch-live-editing", "sass-js-compile-check": "gulp sass-js-compile-check", "build": "gulp generate-live-editing && gulp overwrite-package-json && ng build --configuration production", - "build:app-lob": "gulp generate-live-editing --appDv=true && gulp overwrite-package-json && ng build app-lob --configuration production && gulp prerenderPages", + "build:app-lob": "gulp generate-live-editing --appDv=true && gulp overwrite-package-json && ng build app-lob --configuration production", "build:app-crm": "gulp generate-live-editing --appCrm=true && gulp overwrite-package-json && ng build app-crm --configuration production", "test": "ng test", "lint": "node --max_old_space_size=12192 node_modules/@angular/cli/bin/ng lint", diff --git a/projects/app-lob/src/app/app.routes.server.ts b/projects/app-lob/src/app/app.routes.server.ts index ce62ea928b..17a211d670 100644 --- a/projects/app-lob/src/app/app.routes.server.ts +++ b/projects/app-lob/src/app/app.routes.server.ts @@ -10,11 +10,11 @@ export const serverRoutes: ServerRoute[] = [ renderMode: RenderMode.Client // TODO: Fails with Prerender }, { - path: 'grid-finjs-dock-manager', + path: 'grid-finjs-dock-manager/**', renderMode: RenderMode.Client // TODO: Fails with Prerender }, { - path: 'samples/grid-finjs-dock-manager', + path: 'samples/grid-finjs-dock-manager/**', renderMode: RenderMode.Client // TODO: Fails with Prerender }, { diff --git a/projects/app-lob/src/app/metadata.js b/projects/app-lob/src/app/metadata.js deleted file mode 100644 index 0c688805e2..0000000000 --- a/projects/app-lob/src/app/metadata.js +++ /dev/null @@ -1,101 +0,0 @@ -const Routes = { - Landing: '/', - GridFinjs: '/grid-finjs', - TreeGridFinjs: '/treegrid-finjs', - TreeGridChilddatakey: '/treegrid-childdatakey', - TreeGridPrimaryforeignkey: '/treegrid-primaryforeignkey', - BostonMarathon: '/grid', - MasterDetail: '/grid-master-detail', - FinJsDockManagerGrid: '/grid-finjs-dock-manager', - HierarchicalGrid: '/hierarchical-grid-resizing', -} - -const defaultTitle = 'Data Grids built with Ignite UI for Angular'; -const defaultDescription = 'Data Grids built with Ignite UI for Angular Description'; -const defaultOgUrl = 'https://www.infragistics.com'; - -const metadata = [ - { - url: Routes.Landing, - title: defaultTitle, - description: defaultDescription, - og_url: defaultOgUrl, - folder: '' - }, - { - url: Routes.GridFinjs, - title: 'Real-Time Financial Analysis Data Grid built with Ignite UI for Angular', - description: 'Real-Time Financial Analysis Data Grid built with Ignite UI for Angular', - og_url: 'https://www.infragistics.com/angular-demos-lob/grid-finjs', - folder: '' - }, - { - url: Routes.TreeGridFinjs, - title: 'Angular Tree Grid Example built with Ignite UI for Angular', - description: 'Angular Tree Grid Example built with Ignite UI for Angular', - og_url: 'https://www.infragistics.com/angular-demos-lob/treegrid-finjs', - folder: '' - }, - { - url: Routes.TreeGridChilddatakey, - title: 'Build Better Modern Web Experiences, Faster with Angular Components', - description: 'Create feature-rich, progressive web apps with Ignite UI for Angular! A complete library for Angular native UI components, including the fastest Angular data grid and 60+ high-performance charts.', - og_url: 'https://www.infragistics.com/angular-demos-lob/tree-grid/treegrid-childdatakey', - folder: 'tree-grid' - }, - { - url: Routes.TreeGridPrimaryforeignkey, - title: 'Build Better Modern Web Experiences, Faster with Angular Components', - description: 'Create feature-rich, progressive web apps with Ignite UI for Angular! A complete library for Angular native UI components, including the fastest Angular data grid and 60+ high-performance charts.', - og_url: 'https://www.infragistics.com/angular-demos-lob/tree-grid/treegrid-primaryforeignkey', - folder: 'tree-grid' - }, - { - url: Routes.BostonMarathon, - title: 'Boston Marathon 2023 – Angular Data Grid Example', - description: 'Boston Marathon 2023 – Angular Data Grid Example', - og_url: 'https://www.infragistics.com/angular-demos-lob/grid/grid', - folder: 'grid' - }, - { - url: Routes.MasterDetail, - title: 'Angular Grid Master-Detail Example built with Ignite UI for Angular', - description: 'Angular Grid Master-Detail Example built with Ignite UI for Angular', - og_url: 'https://www.infragistics.com/angular-demos-lob/grid/grid-master-detail', - folder: 'grid' - }, - { - url: Routes.FinJsDockManagerGrid, - title: 'Build Better Modern Web Experiences, Faster with Angular Components', - description: 'Create feature-rich, progressive web apps with Ignite UI for Angular! A complete library for Angular native UI components, including the fastest Angular data grid and 60+ high-performance charts.', - og_url: 'https://www.infragistics.com/angular-demos-lob/grid-finjs-dock-manager/grid-finjs-dock-manager', - folder: 'grid-finjs-dock-manager' - }, - { - url: Routes.HierarchicalGrid, - title: 'Build Better Modern Web Experiences, Faster with Angular Components', - description: 'Create feature-rich, progressive web apps with Ignite UI for Angular! A complete library for Angular native UI components, including the fastest Angular data grid and 60+ high-performance charts.', - og_url: 'https://www.infragistics.com/angular-demos-lob/hierarchical-grid/hierarchical-grid-resizing', - folder: 'hierarchical-grid' - } -]; - -const get = (route) => { - const data = metadata.find(({ url }) => url === route); - if (data) { - return data; - } else { - return { - url: route, - title: defaultTitle, - description: defaultDescription, - og_url: defaultOgUrl - } - } -} - -module.exports = { - metadata, - Routes, - get, -};