1. scully
- Add scully inside your angular app.
ng add @scullyio/init
- do some route configuration in
./scully.<projectName>.config.ts
file.
2. inliner
npm install -g inliner
npm init scully-inliner
cd scully-inliner
npm install express
- create server.js
var Inliner = require('inliner');
var fs = require('fs');
const express = require('express');
const app = express();
const port = 3000;
app.use(express.static('public'));
app.listen(port, () => {
console.log(`listening on port ${port}!`);
new Inliner(`http://localhost:${port}`, function (error, html) {
// compressed and inlined HTML page
fs.appendFile('result.html', html, function (err) {
if (err) throw err;
console.log('Combiled result Saved as result.html!');
});
});
});
- Make static site from angular build using scully. Angular build result itself is not a static site, so scully is there.
ng build
npm run scully
./dist/static
folder will contain the result. If you click index.html, you will see the page works exactly same as the angular app.- copy those files inside the node server app's
public
folder. - Run
node server
to get result.html