Aurelia-Cli

[beatsm]

Hi I am trying to use this using the Aurelia-Cli.

I have been able to get this to bundle by adding this to the Aurelia.json file

"aurelia-http-client", "lodash", "jquery", { "name": "bootstrap", "path": "../node_modules/bootstrap/dist", "main": "js/bootstrap.min", "deps": [ "jquery" ], "exports": "$", "resources": [ "css/bootstrap.css" ] }, { "name": "validate.js", "path": "../node_modules/validate.js", "main": "validate" }, { "name": "aurelia-validation", "path": "../node_modules/aurelia-validation/dist/amd", "main": "aurelia-validation" }, { "name": "aurelia-validatejs", "path": "../node_modules/aurelia-validatejs/dist/amd", "main": "aurelia-validatejs" }, { "name": "i18next", "path": "../node_modules/aurelia-i18n/dist/commonjs", "main": "index" }, { "name": "i18next-xhr-backend", "path": "../node_modules/i18next-xhr-backend/dist/commonjs", "main": "index" }, { "name": "aurelia-i18n", "path": "../node_modules/aurelia-i18n/dist/amd", "main": "index", "deps": [ "i18next", "i18next-xhr-backend" ] }, { "name": "aurelia-editables", "path": "../node_modules/aurelia-editables/dist", "main": "aurelia-editables" }

but keep getting a rejected promise error in the vendor bundle

Does this work with the CLI? Do you have a working example?

Thanks

[beatsm]

Hi again

If I use

"aurelia-http-client", "lodash", "jquery", { "name": "bootstrap", "path": "../node_modules/bootstrap/dist", "main": "js/bootstrap.min", "deps": [ "jquery" ], "exports": "$", "resources": [ "css/bootstrap.css" ] }, { "name": "aurelia-validation", "path": "../node_modules/aurelia-validation/dist/amd", "main": "aurelia-validation" }, { "name": "aurelia-i18n", "path": "../node_modules/aurelia-i18n/dist/amd", "main": "index" }, { "name": "i18next-xhr-backend", "path": "../node_modules/i18next-xhr-backend/dist/umd", "main": "i18nextXHRBackend" }, { "name": "i18next", "path": "../node_modules/i18next/dist/umd", "main": "i18next" }, { "name": "validate.js", "path": "../node_modules/validate.js", "main": "validate" }, { "name": "aurelia-validatejs", "path": "../node_modules/aurelia-validatejs/dist/amd", "main": "aurelia-validatejs" }, { "name": "aurelia-editables", "path": "../nodemodules/aurelia-editables/dist", "main": "aurelia-editables", "resources": [ "/*/.js", "/**/.html!text", "/_/.css!text" ] }

I get a Mismatched anonymouse define error.

Not sure what I am doing wrong here.

Thanks

[martonsagi]

Hi,

v0.1.1 has a jspm-only output, that's why you've got errors above. In order to help you, I've tagged v0.2.0 today. With this version, skeleton-plugin's structure has been adopted, making the package compatible with aurelia-cli. It's available on npmjs as well.

You can find working demos on my main github page: http://martonsagi.github.io/ (bundled demo of aurelia-custom-skeleton repo).

• DataForm: http://martonsagi.github.io/#/profile
• DataGrid: http://martonsagi.github.io/#/editables

Demo source with proper aurelia.json configuration: https://github.com/martonsagi/aurelia-custom-skeleton

I'm working on a more comprehensive demo site, which will demonstrate all (planned) capabilities in details.

Please note:

• Currently, it's designed to work with remote data,
• Field validation is broken due to major updates on aurelia-validation plugin itself,
• It's my first learning project with Aurelia. :)

Any thoughts are welcome, Thanks

[beatsm]

@martonsagi

Thanks very much. I have almost got this to work but am experiencing an issue with aurelia-validation which you may have eluded to above.

I seem to receive the following errors:

1. TypeError: Unable to get property 'ensure' of undefined or null reference\n at setValidation
2. TypeError: Object doesn't support property or method 'then'\n at validate

I am using "aurelia-validation": "^0.12.3" as per your working demo but am not able to see how you got round it.

Can you please advise?

Other than that, what I have seen from the demo looks great. Reminds me of https://github.com/SpoonX/aurelia-form but yours seems a better fit for me due to the use of typescript (and works in IE).

Eventually I will be looking to integrate / rewrite https://github.com/sigmaframeworks/sigma-ui-framework so if you plan on creating any documentation, I would be very interested on how your components are constructed.

Thanks

[martonsagi]

@beatsm

Thanks for the feedback, I'm glad you liked it!

I've looked into the above validation issue. As a result of that, v0.3.0 has a working validation mechanism using the latest aurelia-validation@0.13.1. Package.json has been updated to reflect these changes, so you should not be experiencing TypeError issues anymore.

With v0.3.0, I've reached a point where a minimal set of features are working according to my initial concepts. Now, I'm going to focus on documentation, demo site (I've already made some progress with that), unit test coverage.

I'll keep third-party integrations in mind to support your possible integration as well:

Currently available options:

• Custom events: there are a bunch of custom events for hooking into Form/Grid lifecycle
• WebApi data-layer is replaceable
• Grid toolbar is replaceable
• Existing Field editor templates are replaceable and you can define additional Field types with custom implementation as well (e.g. datepicker)
• Define custom column templates in the configuration object as plain strings.

Future plans:

• Provide the possibility of using Boostrap-independent layouts

Maintaining IE support is also among my core objectives. Although, the DataGrid component has a poor performance with IE at this moment. More optimalization will be necessary for acceptable user experience..

[beatsm]

Thanks