-
-
Save ssatz/9e894070af27a7b9233ff25eb6f8cc2d to your computer and use it in GitHub Desktop.
import 'zone.js/dist/zone-node'; | |
import 'reflect-metadata'; | |
import { enableProdMode } from '@angular/core'; | |
import { ngExpressEngine } from '@nguniversal/express-engine'; | |
import * as express from 'express'; | |
import { join } from 'path'; | |
import { readFileSync } from 'fs'; | |
const domino = require('domino'); | |
// Faster server renders w/ Prod mode (dev mode never needed) | |
enableProdMode(); | |
// Express server | |
const app = express(); | |
const compression = require('compression'); | |
const PORT = process.env.PORT || 3000; | |
const DIST_FOLDER = join(process.cwd(), 'dist'); | |
// Our index.html we'll use as our template | |
const template = readFileSync(join(DIST_FOLDER, 'browser', 'index.html'), 'utf8').toString(); | |
const win = domino.createWindow(template); | |
global['window'] = win; | |
global['document'] = win.document; | |
global['M'] = {}; | |
global['cash'] = require('cash-dom'); | |
global['$'] = global['cash']; | |
global['Element'] = win.Element; | |
global['NodeList'] = win.NodeList; | |
// * NOTE :: leave this as require() since this file is built Dynamically from webpack | |
const { AppServerModuleNgFactory, LAZY_MODULE_MAP } = require('./dist/server/main.bundle'); | |
const { provideModuleMap } = require('@nguniversal/module-map-ngfactory-loader'); | |
app.use(compression()); | |
app.engine('html', ngExpressEngine({ | |
bootstrap: AppServerModuleNgFactory, | |
providers: [ | |
provideModuleMap(LAZY_MODULE_MAP) | |
] | |
})); | |
app.set('view engine', 'html'); | |
app.set('views', join(DIST_FOLDER, 'browser')); | |
// Server static files from /browser | |
app.get('*.*', express.static(join(DIST_FOLDER, 'browser'), { maxAge: '1y' })); | |
// All regular routes use the Universal engine | |
app.get('*', (req, res) => { | |
res.render('index', { | |
req: req, | |
res: res | |
}); | |
}); | |
// Start up the Node server | |
app.listen(PORT, () => { | |
console.log(`Node server listening on http://localhost:${PORT}`); | |
}); |
While executing server.js I am getting this error do you have any idea about this ?
..\node_modules\angular2-materialize\dist\materialize-directive.js:1
(function (exports, require, module, __filename, __dirname) { import { Directive, ElementRef, Input, Output, EventEmitter } from '@angular/core';
^^^^^^
SyntaxError: Unexpected token import
at createScript (vm.js:56:10)
This is my webpack.config.js
const path = require('path');
const webpack = require('webpack');
var nodeExternals = require('webpack-node-externals');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var extractCSS = new ExtractTextPlugin('styles.css');
function resolve(dir) {
return path.join(__dirname, '..', dir)
}
module.exports = {
entry: {
server: './server.ts'
},
resolve: {
extensions: ['.ts', '.js']
},
target: 'node',
externals: [nodeExternals({
whitelist: [
/^@angular/material/,
]
})],
node: {
__dirname: true
},
output: {
path: path.join(__dirname, 'dist'),
filename: '[name].js',
},
module: {
rules: [
{ test: /.ts$/, loader: 'ts-loader' }
]
}
}
Can you also share the webpack.config.js code
Below snippets are for MaterializeCss
global['window'] = win; global['document'] = win.document; global['M'] = {}; global['cash'] = require('cash-dom'); global['$'] = global['cash']; global['Element'] = win.Element; global['NodeList'] = win.NodeList;