Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix build ux #229

Merged
merged 27 commits into from
Dec 3, 2019
Merged

Fix build ux #229

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
27 commits
Select commit Hold shift + click to select a range
e47d1b1
chore(build): use default import for html
bigopon Nov 23, 2019
dcc96bd
chore(example): use esmodule interop for webpack html loader
bigopon Nov 23, 2019
b2b01ed
chore(build): update all packages css bundling
bigopon Nov 25, 2019
065cd7d
chore(all): update doc & dependencies
bigopon Nov 25, 2019
3edd07a
chore(example): update example code
bigopon Nov 25, 2019
6d3a8b7
chore(build): fix datepicker build, revert to multiple modules
bigopon Dec 1, 2019
3f0ca80
chore(core): revert to multiple modules
bigopon Dec 1, 2019
0518b86
chore(textarea): revert to multi-modules build
bigopon Dec 1, 2019
067f63e
chore(switch): revert to multi-modules build
bigopon Dec 1, 2019
4988309
chore(slider): revert to multi-modules build
bigopon Dec 1, 2019
bd0c5a6
chore(select): revert to multi-modules build
bigopon Dec 1, 2019
9d0cc8e
chore(radio): revert to multi-modules build
bigopon Dec 1, 2019
704f8ff
chore(list): revert to multi-modules build
bigopon Dec 1, 2019
ec8fe5e
chore(input-info): revert to multi-modules build
bigopon Dec 1, 2019
4262565
chore(input): revert to multi-modules build
bigopon Dec 1, 2019
38242b9
chore(icons): revert to multi-modules build
bigopon Dec 1, 2019
1bc5aaa
chore(grid): revert to multi-modules build
bigopon Dec 1, 2019
f21fe11
chore(form): revert to multi-modules build
bigopon Dec 1, 2019
59664d3
chore(chip-input): revert to multi-modules build
bigopon Dec 1, 2019
f3b7921
chore(checkbox): revert to multi-modules build
bigopon Dec 1, 2019
1db5898
chore(card): revert to multi-modules build
bigopon Dec 1, 2019
bee7a49
chore(button): revert to multi-modules build
bigopon Dec 1, 2019
13c25aa
chore(deps): update main deps
bigopon Dec 1, 2019
dcc71c4
chore(example): update example app config
bigopon Dec 1, 2019
de3649e
chore(build): ensure build typings for all packages
bigopon Dec 2, 2019
59bf089
chore(components): revert to multi-modules build
bigopon Dec 2, 2019
58bd9e8
chore(examples): update example app config
bigopon Dec 2, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 14 additions & 2 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,14 +60,26 @@ npm run build:dev -- --environment target_dir: path/to/my/dir
npm run build:dev:watch -- --environment target_dir: path/to/my/dir
```

### Run a test app
### Run a test app which emulates dependencies installation
To run the test app, first make sure you built all the packages via the instruction of how to build above. Then open a shell at root of this project and copy paste the following:
```shell
cd app
npm ci
npm run dev
```

### Run a test app with direct source bundling

To run the test app, with all dependencies pointing to the packages source code, first make sure you could run in previous step, then do:
1. Uncomment line 33 to line 65 in webpack.config.js in `app` folder
2. Open a shell at root of this project and run:

To run the test app, with all dependencies pointing to the packages source code, do:
```shell
cd app
npm ci
npm run dev
```

This will use `webpack-dev-server` and `webpack` to alias all `ux` dependencies to the source in `pakcages` folder.

### Testing from the project's root directory
Expand Down
122 changes: 122 additions & 0 deletions app/package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

19 changes: 18 additions & 1 deletion app/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,24 @@
"author": "",
"license": "MIT",
"dependencies": {
"aurelia-logging-console": "^1.1.1"
"@aurelia-ux/button": "file:../packages/button",
"@aurelia-ux/card": "file:../packages/card",
"@aurelia-ux/checkbox": "file:../packages/checkbox",
"@aurelia-ux/chip-input": "file:../packages/chip-input",
"@aurelia-ux/core": "file:../packages/core",
"@aurelia-ux/datepicker": "file:../packages/datepicker",
"@aurelia-ux/grid": "file:../packages/grid",
"@aurelia-ux/icons": "file:../packages/icons",
"@aurelia-ux/input": "file:../packages/input",
"@aurelia-ux/input-info": "file:../packages/input-info",
"@aurelia-ux/list": "file:../packages/list",
"@aurelia-ux/radio": "file:../packages/radio",
"@aurelia-ux/select": "file:../packages/select",
"@aurelia-ux/slider": "file:../packages/slider",
"@aurelia-ux/switch": "file:../packages/switch",
"@aurelia-ux/textarea": "file:../packages/textarea",
"aurelia-logging-console": "^1.1.1",
"moment": "^2.24.0"
},
"devDependencies": {
"aurelia-loader-webpack": "^2.2.1",
Expand Down
27 changes: 14 additions & 13 deletions app/src/main.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,20 +10,21 @@ async function configure(aurelia: Aurelia): Promise<void> {
.standardConfiguration()
.plugin(PLATFORM.moduleName('@aurelia-ux/core'))
.plugin(PLATFORM.moduleName('@aurelia-ux/button'))
.plugin(PLATFORM.moduleName('@aurelia-ux/textarea'))
.plugin(PLATFORM.moduleName('@aurelia-ux/switch'))
.plugin(PLATFORM.moduleName('@aurelia-ux/slider'))
.plugin(PLATFORM.moduleName('@aurelia-ux/select'))
.plugin(PLATFORM.moduleName('@aurelia-ux/radio'))
.plugin(PLATFORM.moduleName('@aurelia-ux/list'))
.plugin(PLATFORM.moduleName('@aurelia-ux/input-info'))
.plugin(PLATFORM.moduleName('@aurelia-ux/input'))
.plugin(PLATFORM.moduleName('@aurelia-ux/icons'))
.plugin(PLATFORM.moduleName('@aurelia-ux/grid'))
.plugin(PLATFORM.moduleName('@aurelia-ux/datepicker'))
.plugin(PLATFORM.moduleName('@aurelia-ux/chip-input'))
.plugin(PLATFORM.moduleName('@aurelia-ux/checkbox'))
.plugin(PLATFORM.moduleName('@aurelia-ux/card'))
.plugin(PLATFORM.moduleName('@aurelia-ux/checkbox'))
.plugin(PLATFORM.moduleName('@aurelia-ux/chip-input'))
.plugin(PLATFORM.moduleName('@aurelia-ux/datepicker'))
.plugin(PLATFORM.moduleName('@aurelia-ux/form'))
.plugin(PLATFORM.moduleName('@aurelia-ux/grid'))
.plugin(PLATFORM.moduleName('@aurelia-ux/icons'))
.plugin(PLATFORM.moduleName('@aurelia-ux/input'))
.plugin(PLATFORM.moduleName('@aurelia-ux/input-info'))
.plugin(PLATFORM.moduleName('@aurelia-ux/list'))
.plugin(PLATFORM.moduleName('@aurelia-ux/radio'))
.plugin(PLATFORM.moduleName('@aurelia-ux/select'))
.plugin(PLATFORM.moduleName('@aurelia-ux/slider'))
.plugin(PLATFORM.moduleName('@aurelia-ux/switch'))
.plugin(PLATFORM.moduleName('@aurelia-ux/textarea'))

await aurelia.start();
await aurelia.setRoot(PLATFORM.moduleName('app'), document.body);
Expand Down
7 changes: 6 additions & 1 deletion app/tsconfig.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,17 @@
{
"extends": "../tsconfig.json",
"compilerOptions": {
"target": "esnext",
"esModuleInterop": true,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Correct choice :-)

"allowSyntheticDefaultImports": true,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is by default turned on when esModuleInterop is true.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thanks, will clean this up

"baseUrl": ".",
"paths": {
"aurelia-framework": [
"../node_modules/aurelia-framework"
]
}
},
"noUnusedLocals": false,
"noUnusedParameters": false
},
"exclude": []
}
113 changes: 96 additions & 17 deletions app/webpack.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,19 +15,32 @@ module.exports = function({ production = '' } = {}) {
modules: [
path.resolve(__dirname, 'src'),
path.resolve(__dirname, 'node_modules'),
// root node modules for common aurelia packages
path.resolve(__dirname, '../node_modules')
],
alias: {
'src': path.resolve(__dirname, 'src'),
// alias all aurelia packages to parent node_modules,
// so packages & core modules will use the same version of core modules
...([
'polyfills',
'dependency-injection',
'loader',
'pal',
'pal-browser',
'metadata',
'logging'
'logging',
'binding',
'path',
'framework',
'history',
'history-browser',
'event-aggregator',
'router',
'route-recognizer',
'templating',
'templating-binding',
'templating-resources',
'templating-router',
'task-queue',
].reduce(
/**
* @param {Record<string, string>} map
Expand Down Expand Up @@ -60,10 +73,11 @@ module.exports = function({ production = '' } = {}) {
'textarea',
].reduce((map, packageName) => {
const mappedPackagedName = `@aurelia-ux/${packageName}`;
map[mappedPackagedName] = path.resolve(__dirname, `../packages/${packageName}/src`)
map[mappedPackagedName] = path.resolve(__dirname, `../packages/${packageName}/src`);
return map;
}, {}))
}
},

},
entry: {
app: './src/main.ts'
Expand All @@ -79,24 +93,89 @@ module.exports = function({ production = '' } = {}) {
loader: 'html-loader'
},
{
test: /\.css$/,
loader: 'css-loader'
}
test: /\.css$/i,
issuer: [{ not: [{ test: /\.html$/i }] }],
use: ['style-loader', 'css-loader']
},
{
test: /\.css$/i,
issuer: [{ test: /\.html$/i }],
// CSS required in templates cannot be extracted safely
// because Aurelia would try to require it again in runtime
use: ['css-loader']
},
]
},
plugins: [
new AureliaWebpackPlugin.AureliaPlugin({
config: [
"defaultBindingLanguage",
// "router",
// "history",
"defaultResources",
"eventAggregator",
"developmentLogging",
],
aureliaApp: undefined,
entry: undefined,
noModulePathResolve: true
dist: 'es2015',
}),
// note that following config is for webpack aliasing to source code
// it won't be necessary for real app
new AureliaWebpackPlugin.ModuleDependenciesPlugin({
'@aurelia-ux/button': [
'./ux-button.html'
],
'@aurelia-ux/card': [
'./ux-card-action-row.html',
'./ux-card-content.html',
'./ux-card-footer.html',
'./ux-card-header.html',
'./ux-card.html'
],
'@aurelia-ux/checkbox': [
'./ux-checkbox.html'
],
'@aurelia-ux/chip-input': [
'./ux-chip-input.html',
'./ux-chip.html'
],
"@aurelia-ux/datepicker": [
"./ux-calendar.html",
"./ux-datepicker.html",
"./ux-picker-dialog.html",
"./ux-year-list.html",
],
'@aurelia-ux/form': [
'./ux-field.html',
'./ux-form.html'
],
'@aurelia-ux/grid': [
'./ux-grid-cell.html',
'./ux-grid.html'
],
'@aurelia-ux/icons': [
'./ux-icon.html'
],
'@aurelia-ux/input': [
'./ux-input.html'
],
'@aurelia-ux/input-info': [
'./ux-input-info.html'
],
'@aurelia-ux/list': [
'./ux-list-item.html',
'./ux-list.html'
],
'@aurelia-ux/radio': [
'./ux-radio.html'
],
'@aurelia-ux/select': [
'./ux-optgroup.html',
'./ux-option.html',
'./ux-select.html'
],
'@aurelia-ux/slider': [
'./ux-slider.html'
],
'@aurelia-ux/switch': [
'./ux-switch.html'
],
'@aurelia-ux/textarea': [
'./ux-textarea.html'
],
}),
new HtmlWebpackPlugin({

Expand Down
Loading