I am going to use Angular platform-server
(which used to be Univeral in Angular 2)
As you might know, you can use ngc
to compile your app using AOT compiler, but I'm since I have some scss/sass
files I can't use that, the other way is to use ngtools/webpack
which does the same thing.
And unfortunately, there is no official documentation for platform-server (server-side rendering, aka Universal), but I found this work-in-progress doc here, and I followed that, but when I run webpack it does not generate the expected aot
directory.
Here is my webpack:
const ngtools = require('@ngtools/webpack');
const webpack = require('webpack');
const path = require('path');
module.exports = {
devtool: 'source-map',
entry: {
main: [
path.join(__dirname, 'src/uni/app-server.module.ts'),
path.join(__dirname, '/src/uni/universal-server.ts')
]
},
resolve: {
extensions: ['.ts', '.js']
},
target: 'node',
output: {
path: path.join(__dirname, '/src/dist'),
filename: 'server.js'
},
plugins: [
new ngtools.AotPlugin({
tsConfigPath: './tsconfig-uni.json',
entryModule: './src/app/app.module#AppModule'
})
],
module: {
rules: [
{
test: /\.scss$/, use: [{
loader: "style-loader"
}, {
loader: "css-loader"
}, {
loader: "sass-loader"
}]
},
{test: /\.css$/, loader: 'raw-loader'},
{test: /\.html$/, loader: 'raw-loader'},
{test: /\.ts$/, loader: '@ngtools/webpack'}
]
}
}
and this is my typescript config for this app:
{
"compilerOptions": {
"target": "es5",
"module": "es2015",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": ["es2015", "dom"],
"noImplicitAny": true,
"suppressImplicitAnyIndexErrors": true,
"typeRoots": [
"./node_modules/@types/"
]
},
"files": [
"./src/uni/app-server.module.ts",
"./src/uni/universal-server.ts"
],
"angularCompilerOptions": {
"genDir": "aot",
"skipMetadataEmit" : true
}
}
and I do expect that returns something and generate the aot directory for me! but it fails and return this error:
WARNING in ./node_modules/express/lib/view.js
79:29-41 Critical dependency: the request of a dependency is an expression
ERROR in ./src/uni/universal-server.ts
Module not found: Error: Can't resolve '../../aot/src/uni/app-server.module.ngfactory' in '/home//website/src/uni'
@ ./src/uni/universal-server.ts 7:0-89
@ multi ./src/uni/app-server.module.ts ./src/uni/universal-server.ts
ERROR in self is not defined
ERROR in /home/website/src/uni/universal-server.ts (7,40): Cannot find module '../../aot/src/uni/app-server.module.ngfactory'.