Skip to content

Commit 8280881

Browse files
lucas-koehlerlucas-koehler
committed
Add bundled example for Angular Material
* Add rollup config to bundle the angular material example * Add to examples app Part of #1706
1 parent 36e3732 commit 8280881

File tree

5 files changed

+88
-1
lines changed

5 files changed

+88
-1
lines changed

‎packages/angular-material/example/index.bundled.html

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>JSON Forms Angular Material RendererSet</title>
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
7+
<link rel="icon" type="image/x-icon" href="favicon.ico">
8+
<link href="indigo-pink.css" rel="stylesheet">
9+
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" type='text/css'>
10+
<link href='https://fonts.googleapis.com/css?family=Roboto:400,900,700,500,300,100' rel='stylesheet' type='text/css'>
11+
</head>
12+
<body>
13+
<app-root></app-root>
14+
</body>
15+
<script src="bundle.js"></script>
16+
</html>
17+
18+
<!--
19+
Copyright 2017-2018 Google Inc. All Rights Reserved.
20+
Use of this source code is governed by an MIT-style license that
21+
can be found in the LICENSE file at http://angular.io/license
22+
-->

‎packages/angular-material/package.json

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@
3535
"typings": "./lib/esm/index.d.ts",
3636
"scripts": {
3737
"build": "ngc && ngc -p tsconfig.cjs.json",
38+
"build:examples-app": "rollup -c rollup.example.config.js",
3839
"dev": "webpack --config webpack/webpack.dev.js && webpack-dev-server --config webpack/webpack.dev.js --env=dev --inline",
3940
"clean": "rimraf lib coverage dist .nyc_output 2> /dev/null",
4041
"lint": "tslint --project tsconfig.json --exclude src/models/jsonSchema.ts",
@@ -88,6 +89,10 @@
8889
"@jsonforms/angular-test": "^3.1.0-alpha.0",
8990
"@jsonforms/core": "^3.1.0-alpha.0",
9091
"@jsonforms/examples": "^3.1.0-alpha.0",
92+
"@rollup/plugin-commonjs": "^23.0.3",
93+
"@rollup/plugin-json": "^5.0.2",
94+
"@rollup/plugin-node-resolve": "^15.0.1",
95+
"@rollup/plugin-replace": "^5.0.1",
9196
"@types/node": "^10.10.0",
9297
"angular2-template-loader": "^0.6.2",
9398
"copy-webpack-plugin": "^5.0.5",
@@ -108,6 +113,12 @@
108113
"protractor": "^5.4.1",
109114
"request": "^2.88.0",
110115
"rimraf": "^3.0.2",
116+
"rollup": "^2.78.0",
117+
"rollup-plugin-cleanup": "^3.2.1",
118+
"rollup-plugin-copy": "^3.4.0",
119+
"rollup-plugin-import-css": "^3.1.0",
120+
"rollup-plugin-typescript2": "^0.31.1",
121+
"rollup-plugin-visualizer": "^5.4.1",
111122
"rxjs": "^6.5.3",
112123
"ts-loader": "^6.2.1",
113124
"tslint": "^5.20.1",

‎packages/angular-material/rollup.example.config.js

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import commonjs from '@rollup/plugin-commonjs';
2+
import json from '@rollup/plugin-json';
3+
import nodeResolve from '@rollup/plugin-node-resolve';
4+
import replace from '@rollup/plugin-replace';
5+
import copy from 'rollup-plugin-copy';
6+
import css from 'rollup-plugin-import-css';
7+
import typescript from 'rollup-plugin-typescript2';
8+
9+
/**
10+
* @type {import('rollup').RollupOptions}
11+
*/
12+
const config = {
13+
input: 'example/main.ts',
14+
output: {
15+
file: 'example/dist/bundle.js',
16+
format: 'iife',
17+
sourcemap: true
18+
},
19+
plugins: [
20+
replace({
21+
'process.env.NODE_ENV': JSON.stringify('production'),
22+
preventAssignment: true, // recommended to be set by library to be forward compatible
23+
}),
24+
nodeResolve({ browser: true }),
25+
// Transform mixed because some JsonForms modules use import and require
26+
commonjs({ transformMixedEsModules: true }),
27+
css(),
28+
json(),
29+
typescript({
30+
tsconfigOverride: {
31+
compilerOptions: {
32+
// Do not emit typescript declarations for our bundled example app
33+
declaration: false
34+
}
35+
}}),
36+
copy({
37+
targets: [
38+
{
39+
src: '../../node_modules/@angular/material/prebuilt-themes/indigo-pink.css',
40+
dest: 'example/dist'
41+
},
42+
{
43+
src: 'example/index.bundled.html',
44+
dest: 'example/dist',
45+
rename: () => 'index.html'
46+
}
47+
]
48+
}),
49+
]
50+
}
51+
52+
export default config;

‎packages/examples-app/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ <h1>JSON Forms Examples</h1>
1212
<ul>
1313
<li><a href="react-vanilla">React Vanilla Renderers</a></li>
1414
<li><a href="react-material">React Material Renderers</a></li>
15+
<li><a href="angular-material">Angular Material Renderers</a></li>
1516
</ul>
1617
</body>
1718
</html>

‎packages/examples-app/prepare-examples-app.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,8 @@ const distDir = join(__dirname, 'dist');
1212
const packagesDir = join(__dirname, '..');
1313
const examples = {
1414
'react-vanilla': join(packagesDir, 'vanilla-renderers', 'example', 'dist'),
15-
'react-material': join(packagesDir, 'material-renderers', 'example', 'dist')
15+
'react-material': join(packagesDir, 'material-renderers', 'example', 'dist'),
16+
'angular-material': join(packagesDir, 'angular-material', 'example', 'dist')
1617
}
1718

1819
// Clean and recreate dist dir

0 commit comments

Comments
 (0)