AngularClass/webpack-toolkit

Name: webpack-toolkit

Owner: AngularClass

Description: Webpack tools and helpers for Angular 2 by @AngularClass

Created: 2016-06-20 19:19:19.0

Updated: 2017-07-28 11:30:58.0

Pushed: 2016-10-05 16:07:49.0

Homepage: https://angularclass.com

Size: 27

Language: TypeScript

GitHub Committers

User	Most Recent Commit	# Commits

Other Committers

User	Email	Most Recent Commit	# Commits

README

---

AngularClass Webpack Toolkit

Webpack helpers and tools for Angular 2

Install

install @angularclass/webpack-toolkit --save-dev

Async Component Route

app/about/about.ts

ponent({
lector: 'about',
mplate: '<h1>About</h1>'

rt class About {}

app/app.routes.ts

rt const routes = [
path: '', component: Home },
path: 'about', component: 'About' }


reate index.ts that exports this file

main.browser.ts

rt {routes} from './app/app.routes';
rt { provideWebpack } from '@angularclass/webpack-toolkit';
strap(App, [
ovideRouter(routes),
ovideWebpack({
'About': require('es6-promise!./app/about')

Async Component with Children Routes

app/about/about.ts

ponent({
lector: 'about',
mplate: '<h1>About</h1> <router-outlet></router-outlet>'

rt class About {}

rt const routes = {
h: 'about', component: About,
ldren: [
 path: '', component: Index },
 path: 'edit', component: Edit }

app/app.routes.ts

rt { WebpackAsyncRoute } from '@angularclass/webpack-toolkit';
rt const routes = [
path: '', component: Home },
path: 'about', component: 'About', canActivate: [ WebpackAsyncRoute ] }


reate index.ts that exports this file

main.browser.ts

rt { routes } from './app/app.routes';
rt { provideWebpack } from '@angularclass/webpack-toolkit';
strap(App, [
ovideRouter(routes),

ovideWebpack({
'About': require('es6-promise!./app/about')

---

enjoy ? AngularClass

AngularClass

Learn AngularJS, Angular 2, and Modern Web Development from the best. Looking for corporate Angular training, want to host us, or Angular consulting? patrick@angularclass.com