Skip to content

Commit cff0aae

Browse files
committed
chore: init commit
0 parents  commit cff0aae

36 files changed

+4894
-0
lines changed

.gitignore

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
node_modules/
2+
dist/
3+
.DS_Store
4+
npm-debug.log
5+
src/ngfactory
6+
coverage/

LICENCE

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) 2017 Bleenco
4+
5+
Permission is hereby granted, free of charge, to any person obtaining a copy
6+
of this software and associated documentation files (the "Software"), to deal
7+
in the Software without restriction, including without limitation the rights
8+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9+
copies of the Software, and to permit persons to whom the Software is
10+
furnished to do so, subject to the following conditions:
11+
12+
The above copyright notice and this permission notice shall be included in all
13+
copies or substantial portions of the Software.
14+
15+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21+
SOFTWARE.

README.md

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Angular Webpack Seed
2+
3+
<p align="center">
4+
<img src="https://cloud.githubusercontent.com/assets/1796022/23861990/11b1ac98-080c-11e7-8ea6-30c66633f8df.png" width="200">
5+
</p>
6+
7+
---
8+
9+
### Commands
10+
11+
```sh
12+
# Development
13+
npm start
14+
15+
# Production Build
16+
npm run build:prod
17+
18+
# Run Server
19+
node dist/server.js
20+
```
21+
22+
### Licence
23+
24+
MIT

package.json

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
{
2+
"name": "angular-webpack-seed",
3+
"version": "0.1.0",
4+
"main": "index.js",
5+
"scripts": {
6+
"start": "webpack-dev-server --env.client --env.serve --progress",
7+
"start:aot": "webpack-dev-server --env.client --env.serve --env.aot --progress",
8+
"build:client": "webpack --env.client --env.aot --progress --hide-modules",
9+
"build:server": "webpack --env.server --env.aot --progress --hide-modules",
10+
"build": "npm run build:client && npm run build:server",
11+
"prebuild": "npm run clean",
12+
"clean": "rimraf dist",
13+
"server": "node dist/server.js"
14+
},
15+
"repository": {
16+
"type": "git",
17+
"url": "git+https://github.com/bleenco/angular-webpack-seed.git"
18+
},
19+
"authors": [
20+
"Jan Kuri <jkuri88@gmail.com>",
21+
"Irman Abdic <irman.abdic@gmail.com>"
22+
],
23+
"license": "MIT",
24+
"bugs": {
25+
"url": "https://github.com/bleenco/angular-webpack-seed/issues"
26+
},
27+
"homepage": "https://github.com/bleenco/angular-webpack-seed#readme",
28+
"dependencies": {
29+
"@angular/common": "^4.0.0-rc.3",
30+
"@angular/compiler": "^4.0.0-rc.3",
31+
"@angular/core": "^4.0.0-rc.3",
32+
"@angular/forms": "^4.0.0-rc.3",
33+
"@angular/http": "^4.0.0-rc.3",
34+
"@angular/platform-browser": "^4.0.0-rc.3",
35+
"@angular/platform-browser-dynamic": "^4.0.0-rc.3",
36+
"@angular/platform-server": "^4.0.0-rc.3",
37+
"@angular/router": "^4.0.0-rc.3",
38+
"@angularclass/universal-express": "^1.0.1",
39+
"@angularclass/universal-transfer-state": "^1.0.11",
40+
"core-js": "^2.4.1",
41+
"express": "^4.15.2",
42+
"rxjs": "^5.2.0",
43+
"zone.js": "~0.7.7"
44+
},
45+
"devDependencies": {
46+
"@angular/compiler-cli": "^4.0.0-rc.3",
47+
"@ngtools/webpack": "^1.2.13",
48+
"@types/express": "^4.0.35",
49+
"@types/node": "^7.0.8",
50+
"add-asset-html-webpack-plugin": "^1.0.2",
51+
"angular2-template-loader": "^0.6.2",
52+
"awesome-typescript-loader": "^3.1.2",
53+
"codelyzer": "^3.0.0-beta.3",
54+
"copy-webpack-plugin": "^4.0.1",
55+
"css-loader": "^0.27.3",
56+
"extract-text-webpack-plugin": "^2.1.0",
57+
"file-loader": "^0.10.1",
58+
"html-webpack-plugin": "^2.28.0",
59+
"ng-router-loader": "^2.1.0",
60+
"node-sass": "^4.5.0",
61+
"portfinder": "^1.0.13",
62+
"raw-loader": "^0.5.1",
63+
"rimraf": "^2.6.1",
64+
"sass-loader": "^6.0.3",
65+
"script-ext-html-webpack-plugin": "^1.7.1",
66+
"style-loader": "^0.13.2",
67+
"to-string-loader": "^1.1.5",
68+
"tslint": "^4.5.1",
69+
"typescript": "^2.2.1",
70+
"webpack": "^2.2.1",
71+
"webpack-dev-server": "^2.4.2",
72+
"webpack-dll-bundles-plugin": "^1.0.0-beta.5",
73+
"webpack-merge": "^4.0.0"
74+
}
75+
}

public/favicon.ico

1.12 KB
Binary file not shown.

src/api/app.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import { data } from './data';
2+
3+
export class App {
4+
getData() {
5+
return data;
6+
}
7+
}

src/api/data.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
export const data = {
2+
greeting: 'Hello',
3+
name: 'World'
4+
};

src/app/+lazy/lazy.module.ts

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import {NgModule, Component} from '@angular/core'
2+
import {RouterModule} from '@angular/router'
3+
4+
5+
@Component({
6+
selector: 'lazy-view',
7+
template: `<h3>i'm lazy</h3>`
8+
})
9+
export class LazyView {}
10+
11+
@NgModule({
12+
declarations: [LazyView],
13+
imports: [
14+
RouterModule.forChild([
15+
{ path: '', component: LazyView, pathMatch: 'full'}
16+
])
17+
]
18+
})
19+
export class LazyModule {
20+
21+
}

src/app/app.component.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<h1>Angular Webpack Seed</h1>
2+
<a routerLink="/">Home</a>
3+
<a routerLink="/lazy">Lazy</a>
4+
<router-outlet></router-outlet>

src/app/app.component.ts

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { Component, OnInit } from '@angular/core';
2+
import { TransferState } from '@angularclass/universal-transfer-state';
3+
4+
@Component({
5+
selector: 'app-root',
6+
templateUrl: 'app.component.html'
7+
})
8+
export class AppComponent implements OnInit {
9+
constructor(private cache: TransferState) {}
10+
11+
ngOnInit() {
12+
this.cache.set('cached', true);
13+
}
14+
}

src/app/app.module.ts

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
import { NgModule } from '@angular/core';
2+
import { BrowserModule } from '@angular/platform-browser';
3+
import { APP_BASE_HREF, CommonModule } from '@angular/common';
4+
import { HttpModule } from '@angular/http';
5+
import { RouterModule } from '@angular/router';
6+
import { AppComponent } from './app.component';
7+
import { HomeViewComponent } from './home/home-view.component';
8+
import { TransferHttpModule } from '@angularclass/universal-transfer-state/browser';
9+
10+
11+
@NgModule({
12+
imports: [
13+
CommonModule,
14+
HttpModule,
15+
TransferHttpModule,
16+
RouterModule.forRoot([
17+
{ path: '', component: HomeViewComponent, pathMatch: 'full'},
18+
{ path: 'lazy', loadChildren: './+lazy/lazy.module#LazyModule'}
19+
])
20+
],
21+
providers: [
22+
{ provide: APP_BASE_HREF, useValue: '/'}
23+
],
24+
declarations: [ AppComponent, HomeViewComponent ],
25+
exports: [ AppComponent ]
26+
})
27+
export class AppModule {}

src/app/browser-app.module.ts

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import { NgModule } from '@angular/core';
2+
import { BrowserModule } from '@angular/platform-browser';
3+
import { AppComponent } from './app.component';
4+
import { AppModule } from './app.module';
5+
import { BrowserTransferStateModule } from '@angularclass/universal-transfer-state/browser';
6+
7+
@NgModule({
8+
bootstrap: [ AppComponent ],
9+
imports: [
10+
BrowserModule.withServerTransition({
11+
appId: 'my-app-id'
12+
}),
13+
BrowserTransferStateModule,
14+
AppModule
15+
]
16+
})
17+
export class BrowserAppModule {}

src/app/home/home-view.component.ts

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import { Component, OnInit } from '@angular/core';
2+
import { TransferHttp } from '@angularclass/universal-transfer-state';
3+
4+
@Component({
5+
selector: 'app-home-view',
6+
template: `<h3>{{ data }}</h3>`
7+
})
8+
export class HomeViewComponent implements OnInit {
9+
data: { greeting: string, name: string };
10+
11+
constructor(private http: TransferHttp) {}
12+
13+
ngOnInit() {
14+
this.http.get('http://localhost:8000/data')
15+
.first()
16+
.map(data => {
17+
return `${ data.greeting } ${ data.name }`;
18+
})
19+
.subscribe(data => this.data = data, err => {
20+
this.data = err;
21+
});
22+
}
23+
}

src/app/server-app.module.ts

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import { NgModule } from '@angular/core';
2+
import { ServerModule } from '@angular/platform-server';
3+
import { AppComponent } from './app.component';
4+
import { AppModule } from './app.module';
5+
import { ServerTransferStateModule, TransferState } from '@angularclass/universal-transfer-state/server';
6+
import { UniversalOnInit } from '@angularclass/universal-express';
7+
import { BrowserModule } from '@angular/platform-browser';
8+
9+
@NgModule({
10+
bootstrap: [AppComponent],
11+
imports: [
12+
BrowserModule.withServerTransition({
13+
appId: 'my-app-id'
14+
}),
15+
ServerModule,
16+
ServerTransferStateModule,
17+
AppModule
18+
]
19+
})
20+
export class ServerAppModule implements UniversalOnInit {
21+
22+
constructor(private transferState: TransferState) { }
23+
24+
// Gotcha
25+
universalOnInit() {
26+
this.transferState.inject();
27+
}
28+
}

src/index.html

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Angular Webpack Seed</title>
6+
<base href="/">
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
8+
<link rel="icon" type="image/x-icon" href="favicon.ico">
9+
</head>
10+
<body>
11+
<app-root></app-root>
12+
</body>
13+
</html>

src/main.browser.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import './styles';
2+
import './polyfills';
3+
import 'rxjs';
4+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
5+
import { BrowserAppModule } from './app/browser-app.module';
6+
7+
platformBrowserDynamic().bootstrapModule(BrowserAppModule);

src/main.server.aot.ts

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import 'zone.js/dist/zone-node';
2+
import 'reflect-metadata';
3+
import 'rxjs';
4+
import * as express from 'express';
5+
import { platformServer, renderModuleFactory } from '@angular/platform-server';
6+
import { ServerAppModuleNgFactory } from './ngfactory/app/server-app.module.ngfactory';
7+
import { universalExpressEngine } from '@angularclass/universal-express';
8+
import { ROUTES } from './routes';
9+
import { App } from './api/app';
10+
import { enableProdMode } from '@angular/core';
11+
enableProdMode();
12+
const app = express();
13+
const api = new App();
14+
const port = 8000;
15+
const baseUrl = `http://localhost:${ port }`;
16+
17+
app.engine('html', universalExpressEngine({
18+
ngModule: ServerAppModuleNgFactory
19+
}));
20+
21+
app.set('view engine', 'html');
22+
app.set('views', 'src');
23+
24+
app.use('/', express.static('dist', { index: false }));
25+
26+
ROUTES.forEach(route => {
27+
app.get(route, (req, res) => {
28+
console.time(`GET: ${req.originalUrl}`);
29+
res.render('index', {
30+
req: req,
31+
res: res
32+
});
33+
console.timeEnd(`GET: ${req.originalUrl}`);
34+
});
35+
});
36+
37+
app.get('/data', (req, res) => {
38+
console.time(`GET: ${req.originalUrl}`);
39+
res.json(api.getData());
40+
console.timeEnd(`GET: ${req.originalUrl}`);
41+
});
42+
43+
app.listen(8000, () => {
44+
console.log(`Listening at ${baseUrl}`);
45+
});

src/main.server.ts

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
import './styles';
2+
import 'zone.js/dist/zone-node';
3+
import 'reflect-metadata';
4+
import 'rxjs';
5+
import * as express from 'express';
6+
import { platformServer, renderModuleFactory } from '@angular/platform-server';
7+
import { ServerAppModule } from './app/server-app.module';
8+
import { universalExpressEngine } from '@angularclass/universal-express';
9+
import { ROUTES } from './routes';
10+
import { App } from './api/app';
11+
import { enableProdMode } from '@angular/core';
12+
enableProdMode();
13+
const app = express();
14+
const port = 8000;
15+
const api = new App();
16+
const baseUrl = `http://localhost:${ port }`;
17+
18+
app.engine('html', universalExpressEngine({
19+
ngModule: ServerAppModule
20+
}));
21+
22+
app.set('view engine', 'html');
23+
app.set('views', 'src');
24+
25+
app.use('/', express.static('dist', { index: false }));
26+
27+
ROUTES.forEach(route => {
28+
app.get(route, (req, res) => {
29+
console.time(`GET: ${ req.originalUrl }`);
30+
res.render('../dist/index', {
31+
req: req,
32+
res: res
33+
});
34+
console.timeEnd(`GET: ${ req.originalUrl }`);
35+
});
36+
});
37+
38+
app.get('/data', (req, res) => {
39+
console.time(`GET: ${req.originalUrl}`);
40+
res.json(api.getData());
41+
console.timeEnd(`GET: ${req.originalUrl}`);
42+
});
43+
44+
app.listen(8000, () => {
45+
console.log(`Listening at ${baseUrl}`);
46+
});

0 commit comments

Comments
 (0)