Skip to content

Commit bac1515

Browse files
pskelinpskelin
authored
improvement: switch bundle to use dist folder (#176)
- this is closer to what apps will consume - a second rollup configuration is used to process less->css and use a watch mode - remove theme bundle functionality, themes are inlined now
1 parent e225a3d commit bac1515

File tree

10 files changed

+330
-224
lines changed

10 files changed

+330
-224
lines changed

‎packages/base/src/sap/ui/webcomponents/base/theming/ThemeBundle.js‎

Lines changed: 1 addition & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,5 @@
1-
import { fetchJsonOnce } from "../util/FetchHelper";
2-
3-
const themes = new Map();
4-
const themeBundles = new Map();
51
const styles = new Map();
62

7-
const registerThemeBundleUrl = (packageName, themeName, url) => {
8-
themes.set(`${packageName}_${themeName}`, url);
9-
};
10-
11-
const fetchThemeBundle = async (packageName, themeName) => {
12-
const url = themes.get(`${packageName}_${themeName}`);
13-
const bundle = await fetchJsonOnce(url);
14-
themeBundles.set(`${packageName}_${themeName}`, bundle);
15-
return bundle;
16-
};
17-
183
const registerStyle = (theme, styleName, styleContent) => {
194
if (typeof (styleContent) === "string" && styleContent.length) {
205
// is inlined string
@@ -38,19 +23,7 @@ const getStyle = (theme, styleName) => {
3823
};
3924

4025
const getStyles = async (theme, styleNames) => {
41-
// styles inlined from build or allready fetched
42-
const stylesPopulated = styleNames.every(styleName => getStyle(theme, styleName));
43-
44-
if (!stylesPopulated) {
45-
// use bundle to fetch the styles efficiently
46-
const themeData = await fetchThemeBundle("@ui5/webcomponents", theme);
47-
48-
Object.entries(themeData).forEach(([key, value]) => {
49-
registerStyle(theme, key, value);
50-
});
51-
}
52-
5326
return styleNames.map(styleName => getStyle(theme, styleName));
5427
};
5528

56-
export { registerThemeBundleUrl as registerThemeBundle, registerStyle, getStyles };
29+
export { registerStyle, getStyles };

‎packages/main/.eslintignore‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,5 +6,5 @@ lib
66
test
77
bundle.esm.js
88
bundle.es5.js
9-
rollup.config.js
9+
rollup.config*.js
1010
wdio.conf.js

‎packages/main/bundle.esm.js‎

Lines changed: 38 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -3,53 +3,52 @@ import "@ui5/webcomponents-base/src/sap/ui/webcomponents/base/browsersupport/Edg
33

44
import "@ui5/webcomponents-base/src/sap/ui/webcomponents/base/shims/jquery-shim";
55
import "@ui5/webcomponents-base/src/sap/ui/webcomponents/base/events/PolymerGestures";
6-
import "./src/ThemeProvider";
76

87
import Gregorian from "@ui5/webcomponents-core/dist/sap/ui/core/date/Gregorian";
98
import Buddhist from "@ui5/webcomponents-core/dist/sap/ui/core/date/Buddhist";
109
import Islamic from "@ui5/webcomponents-core/dist/sap/ui/core/date/Islamic";
1110
import Japanese from "@ui5/webcomponents-core/dist/sap/ui/core/date/Japanese";
1211
import Persian from "@ui5/webcomponents-core/dist/sap/ui/core/date/Persian";
1312

14-
import Button from "./src/Button";
15-
import CheckBox from "./src/CheckBox";
16-
import Card from "./src/Card";
17-
import Calendar from "./src/Calendar";
18-
import CalendarHeader from "./src/CalendarHeader";
19-
import DatePicker from "./src/DatePicker";
20-
import Dialog from "./src/Dialog";
21-
import Icon from "./src/Icon";
22-
import Input from "./src/Input";
23-
import InputSuggestions from "./src/InputSuggestions";
24-
import Label from "./src/Label";
25-
import Link from "./src/Link";
26-
import DayPicker from "./src/DayPicker";
27-
import Popover from "./src/Popover";
28-
import Panel from "./src/Panel";
29-
import RadioButton from "./src/RadioButton";
30-
import Select from "./src/Select";
31-
import ShellBar from "./src/ShellBar";
32-
import ShellBarItem from "./src/ShellBarItem";
33-
import Switch from "./src/Switch";
34-
import TabContainer from "./src/TabContainer";
35-
import Tab from "./src/Tab";
36-
import TabSeparator from "./src/TabSeparator";
37-
import Table from "./src/Table";
38-
import TableColumn from "./src/TableColumn";
39-
import TableRow from "./src/TableRow";
40-
import TableCell from "./src/TableCell";
41-
import TextArea from "./src/TextArea";
42-
import Timeline from "./src/Timeline";
43-
import TimelineItem from "./src/TimelineItem";
44-
import Title from "./src/Title";
45-
import ToggleButton from "./src/ToggleButton";
46-
import Toolbar from "./src/Toolbar";
47-
import ToolbarSpacer from "./src/ToolbarSpacer";
13+
import Button from "./dist/Button";
14+
import CheckBox from "./dist/CheckBox";
15+
import Card from "./dist/Card";
16+
import Calendar from "./dist/Calendar";
17+
import CalendarHeader from "./dist/CalendarHeader";
18+
import DatePicker from "./dist/DatePicker";
19+
import Dialog from "./dist/Dialog";
20+
import Icon from "./dist/Icon";
21+
import Input from "./dist/Input";
22+
import InputSuggestions from "./dist/InputSuggestions";
23+
import Label from "./dist/Label";
24+
import Link from "./dist/Link";
25+
import DayPicker from "./dist/DayPicker";
26+
import Popover from "./dist/Popover";
27+
import Panel from "./dist/Panel";
28+
import RadioButton from "./dist/RadioButton";
29+
import Select from "./dist/Select";
30+
import ShellBar from "./dist/ShellBar";
31+
import ShellBarItem from "./dist/ShellBarItem";
32+
import Switch from "./dist/Switch";
33+
import TabContainer from "./dist/TabContainer";
34+
import Tab from "./dist/Tab";
35+
import TabSeparator from "./dist/TabSeparator";
36+
import Table from "./dist/Table";
37+
import TableColumn from "./dist/TableColumn";
38+
import TableRow from "./dist/TableRow";
39+
import TableCell from "./dist/TableCell";
40+
import TextArea from "./dist/TextArea";
41+
import Timeline from "./dist/Timeline";
42+
import TimelineItem from "./dist/TimelineItem";
43+
import Title from "./dist/Title";
44+
import ToggleButton from "./dist/ToggleButton";
45+
import Toolbar from "./dist/Toolbar";
46+
import ToolbarSpacer from "./dist/ToolbarSpacer";
4847

49-
import List from "./src/List";
50-
import StandardListItem from "./src/StandardListItem";
51-
import CustomListItem from "./src/CustomListItem";
52-
import GroupHeaderListItem from "./src/GroupHeaderListItem";
48+
import List from "./dist/List";
49+
import StandardListItem from "./dist/StandardListItem";
50+
import CustomListItem from "./dist/CustomListItem";
51+
import GroupHeaderListItem from "./dist/GroupHeaderListItem";
5352

5453
// used in test pages
5554
import RenderScheduler from "@ui5/webcomponents-base/src/sap/ui/webcomponents/base/RenderScheduler";

‎packages/main/entries-less.esm.js‎

Lines changed: 151 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,151 @@
1+
import "./src/themes/sap_belize/Button.less";
2+
import "./src/themes/sap_belize_hcb/Button.less";
3+
import "./src/themes/sap_fiori_3/Button.less";
4+
5+
import "./src/themes/sap_belize/CheckBox.less";
6+
import "./src/themes/sap_belize_hcb/CheckBox.less";
7+
import "./src/themes/sap_fiori_3/CheckBox.less";
8+
9+
import "./src/themes/sap_belize/Card.less";
10+
import "./src/themes/sap_belize_hcb/Card.less";
11+
import "./src/themes/sap_fiori_3/Card.less";
12+
13+
import "./src/themes/sap_belize/Calendar.less";
14+
import "./src/themes/sap_belize_hcb/Calendar.less";
15+
import "./src/themes/sap_fiori_3/Calendar.less";
16+
17+
import "./src/themes/sap_belize/CalendarHeader.less";
18+
import "./src/themes/sap_belize_hcb/CalendarHeader.less";
19+
import "./src/themes/sap_fiori_3/CalendarHeader.less";
20+
21+
import "./src/themes/sap_belize/DatePicker.less";
22+
import "./src/themes/sap_belize_hcb/DatePicker.less";
23+
import "./src/themes/sap_fiori_3/DatePicker.less";
24+
25+
import "./src/themes/sap_belize/Dialog.less";
26+
import "./src/themes/sap_belize_hcb/Dialog.less";
27+
import "./src/themes/sap_fiori_3/Dialog.less";
28+
29+
import "./src/themes/sap_belize/Icon.less";
30+
import "./src/themes/sap_belize_hcb/Icon.less";
31+
import "./src/themes/sap_fiori_3/Icon.less";
32+
33+
import "./src/themes/sap_belize/Input.less";
34+
import "./src/themes/sap_belize_hcb/Input.less";
35+
import "./src/themes/sap_fiori_3/Input.less";
36+
37+
import "./src/themes/sap_belize/Label.less";
38+
import "./src/themes/sap_belize_hcb/Label.less";
39+
import "./src/themes/sap_fiori_3/Label.less";
40+
41+
import "./src/themes/sap_belize/ShellBarInput.less";
42+
import "./src/themes/sap_belize_hcb/ShellBarInput.less";
43+
import "./src/themes/sap_fiori_3/ShellBarInput.less";
44+
45+
import "./src/themes/sap_belize/Link.less";
46+
import "./src/themes/sap_belize_hcb/Link.less";
47+
import "./src/themes/sap_fiori_3/Link.less";
48+
49+
import "./src/themes/sap_belize/DayPicker.less";
50+
import "./src/themes/sap_belize_hcb/DayPicker.less";
51+
import "./src/themes/sap_fiori_3/DayPicker.less";
52+
53+
import "./src/themes/sap_belize/Popover.less";
54+
import "./src/themes/sap_belize_hcb/Popover.less";
55+
import "./src/themes/sap_fiori_3/Popover.less";
56+
57+
import "./src/themes/sap_belize/Panel.less";
58+
import "./src/themes/sap_belize_hcb/Panel.less";
59+
import "./src/themes/sap_fiori_3/Panel.less";
60+
61+
import "./src/themes/sap_belize/RadioButton.less";
62+
import "./src/themes/sap_belize_hcb/RadioButton.less";
63+
import "./src/themes/sap_fiori_3/RadioButton.less";
64+
65+
import "./src/themes/sap_belize/Switch.less";
66+
import "./src/themes/sap_belize_hcb/Switch.less";
67+
import "./src/themes/sap_fiori_3/Switch.less";
68+
69+
import "./src/themes/sap_belize/Select.less";
70+
import "./src/themes/sap_belize_hcb/Select.less";
71+
import "./src/themes/sap_fiori_3/Select.less";
72+
73+
import "./src/themes/sap_belize/ShellBar.less";
74+
import "./src/themes/sap_belize_hcb/ShellBar.less";
75+
import "./src/themes/sap_fiori_3/ShellBar.less";
76+
77+
import "./src/themes/sap_belize/TabContainer.less";
78+
import "./src/themes/sap_belize_hcb/TabContainer.less";
79+
import "./src/themes/sap_fiori_3/TabContainer.less";
80+
81+
import "./src/themes/sap_belize/Table.less";
82+
import "./src/themes/sap_belize_hcb/Table.less";
83+
import "./src/themes/sap_fiori_3/Table.less";
84+
85+
import "./src/themes/sap_belize/TableRow.less";
86+
import "./src/themes/sap_belize_hcb/TableRow.less";
87+
import "./src/themes/sap_fiori_3/TableRow.less";
88+
89+
import "./src/themes/sap_belize/TextArea.less";
90+
import "./src/themes/sap_belize_hcb/TextArea.less";
91+
import "./src/themes/sap_fiori_3/TextArea.less";
92+
93+
import "./src/themes/sap_belize/TableCell.less";
94+
import "./src/themes/sap_belize_hcb/TableCell.less";
95+
import "./src/themes/sap_fiori_3/TableCell.less";
96+
97+
import "./src/themes/sap_belize/TableColumn.less";
98+
import "./src/themes/sap_belize_hcb/TableColumn.less";
99+
import "./src/themes/sap_fiori_3/TableColumn.less";
100+
101+
import "./src/themes/sap_belize/Title.less";
102+
import "./src/themes/sap_belize_hcb/Title.less";
103+
import "./src/themes/sap_fiori_3/Title.less";
104+
105+
import "./src/themes/sap_belize/TimelineItem.less";
106+
import "./src/themes/sap_belize_hcb/TimelineItem.less";
107+
import "./src/themes/sap_fiori_3/TimelineItem.less";
108+
109+
import "./src/themes/sap_belize/Timeline.less";
110+
import "./src/themes/sap_belize_hcb/Timeline.less";
111+
import "./src/themes/sap_fiori_3/Timeline.less";
112+
113+
import "./src/themes/sap_belize/ToggleButton.less";
114+
import "./src/themes/sap_belize_hcb/ToggleButton.less";
115+
import "./src/themes/sap_fiori_3/ToggleButton.less";
116+
117+
import "./src/themes/sap_belize/Toolbar.less";
118+
import "./src/themes/sap_belize_hcb/Toolbar.less";
119+
import "./src/themes/sap_fiori_3/Toolbar.less";
120+
121+
import "./src/themes/sap_belize/ToolbarSpacer.less";
122+
import "./src/themes/sap_belize_hcb/ToolbarSpacer.less";
123+
import "./src/themes/sap_fiori_3/ToolbarSpacer.less";
124+
125+
import "./src/themes/sap_belize/List.less";
126+
import "./src/themes/sap_belize_hcb/List.less";
127+
import "./src/themes/sap_fiori_3/List.less";
128+
129+
import "./src/themes/sap_belize/GroupHeaderListItem.less";
130+
import "./src/themes/sap_belize_hcb/GroupHeaderListItem.less";
131+
import "./src/themes/sap_fiori_3/GroupHeaderListItem.less";
132+
133+
import "./src/themes/sap_belize/MonthPicker.less";
134+
import "./src/themes/sap_belize_hcb/MonthPicker.less";
135+
import "./src/themes/sap_fiori_3/MonthPicker.less";
136+
137+
import "./src/themes/sap_belize/YearPicker.less";
138+
import "./src/themes/sap_belize_hcb/YearPicker.less";
139+
import "./src/themes/sap_fiori_3/YearPicker.less";
140+
141+
import "./src/themes/sap_belize/Popup.less";
142+
import "./src/themes/sap_belize_hcb/Popup.less";
143+
import "./src/themes/sap_fiori_3/Popup.less";
144+
145+
import "./src/themes/sap_belize/ListItemBase.less";
146+
import "./src/themes/sap_belize_hcb/ListItemBase.less";
147+
import "./src/themes/sap_fiori_3/ListItemBase.less";
148+
149+
import "./src/themes/sap_belize/ListItem.less";
150+
import "./src/themes/sap_belize_hcb/ListItem.less";
151+
import "./src/themes/sap_fiori_3/ListItem.less";

‎packages/main/lib/less-to-json-imports/index.js‎

Lines changed: 0 additions & 37 deletions
This file was deleted.

‎packages/main/package.json‎

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,8 @@
4444
}
4545
},
4646
"scripts": {
47-
"build": "npm-run-all --sequential clean lint build:templates build:samples build:bundle copy:src copy:i18n import-rewrite",
47+
"build": "npm-run-all --sequential clean lint build:templates build:samples build:less copy:src build:bundle copy:i18n",
48+
"build:less": "rollup -c rollup.config.less.js",
4849
"build:bundle": "rollup -c --environment ES5_BUILD",
4950
"build:templates": "mkdirp src/build/compiled && node ./lib/hbs2ui5/index.js -d src/ -o src/build/compiled",
5051
"build:samples": "npm run copy:test --scripts-prepend-node-path && npm run build:api --scripts-prepend-node-path && npm run build:docs --scripts-prepend-node-path && node lib/playground/index.js",
@@ -53,14 +54,13 @@
5354
"build:api": "jsdoc -c ../../lib/jsdoc/config.json",
5455
"build:docs": "node ../../lib/documentation/index.js",
5556
"clean": "rimraf dist src/build",
56-
"copy:src": "cpx \"src/**/*.js\" dist/",
57+
"copy:src": "copy-and-watch \"src/**/*.js\" \"src/**/i18n/*.json\" dist/",
5758
"copy:i18n": "cpx \"src/i18n/*.json\" dist/i18n",
5859
"copy:test": "cpx \"test/**/*.*\" dist/test-resources",
5960
"copy:pages": "cpx \"test/**/pages/*.*\" dist/test-resources",
6061
"copy:qunit": "cpx \"test/**/qunit/*.*\" dist/test-resources",
61-
"dev": "npm-run-all --parallel watch:templates watch:samples watch:pages watch:qunit watch:bundle",
62+
"dev": "npm-run-all --parallel watch:less watch:templates watch:samples watch:pages watch:qunit watch:src watch:bundle",
6263
"start": "npm-run-all --parallel serve:static dev",
63-
"import-rewrite": "node ./lib/less-to-json-imports/index.js dist/",
6464
"lint": "eslint .",
6565
"test:wdio": "npm-run-all --parallel --race serve:static test:wdio-run",
6666
"serve:static-prepare": "cpx \"serve.json\" dist/",
@@ -69,7 +69,9 @@
6969
"test:wdio-run": "cross-env WDIO_LOG_LEVEL=error FORCE_COLOR=0 wdio wdio.conf.js",
7070
"test:jest": "jest",
7171
"test": "npm-run-all --sequential test:jest test:wdio",
72-
"watch:bundle": "rollup -c -w --environment ES5_BUILD,DEV",
72+
"watch:src": "copy-and-watch --watch \"src/**/*.js\" \"src/**/i18n/*.json\" dist/",
73+
"watch:less": "rollup -c rollup.config.less.js -w",
74+
"watch:bundle": "wait-on dist/less-bundle/entries-less.esm.js && rollup -c -w --environment ES5_BUILD,DEV",
7375
"watch:templates": "npm-watch build:templates",
7476
"watch:samples": "npm-watch build:samples",
7577
"watch:pages": "npm-watch build:pages",
@@ -97,6 +99,7 @@
9799
"@wdio/sync": "^5.4.13",
98100
"chromedriver": "^2.45.0",
99101
"clean-css": "^4.2.1",
102+
"copy-and-watch": "^0.1.2",
100103
"cpx": "^1.5.0",
101104
"cross-env": "^5.2.0",
102105
"escodegen": "^1.11.0",
@@ -126,6 +129,7 @@
126129
"rollup-plugin-url": "^2.2.0",
127130
"rollup-plugin-visualizer": "^0.9.2",
128131
"serve": "^10.1.1",
132+
"wait-on": "^3.2.0",
129133
"wdio-chromedriver-service": "^5.0.0"
130134
},
131135
"resolutions": {

0 commit comments

Comments
 (0)