Not sure if this is the right place to ask but just wondering if anyone has a good guide on setting up a Typescript package to be consumed by an Aurelia App (either in ESNext or in TS)?
I’ve gotten something to sort of work, but there seems to be a lot of issues between the bundler, tsc, etc. So would be good if someone has something as an example or even just to point me in the right direction.
I was able to do a simple package, but the moment it gets more complicated, things seem to breakdown.
Similar issues for non-ts packages, we could probably use an up to date guide for all plugin types with an example that has:
Custom Element
CSS export for element
Sub Custom Element used within Custom Element
Stand Alone Class Export
Plugin Config
I’ve been having plugin issues for quite some time now both on the CLI and Webpack, so some solid up to date examples would really help out. Better yet a CLI create plugin command.
@gregoryagu Yea, I created a TS project using Aurelia-CLI to consume the package/plugin. But I ran into a few issues doing that. Basically got to the point where I wasn’t sure where the problem lied, whether that be Aurelia CLI, Webpack (used to generate the UMDs for the package) or if its Typescript itself.
I am not sure whether I understand your question quite well, are you seeking for a template in typescript to create Aurelia plugins? and you wish that you could create custom elements, value converters and etc. in that template? If yes I recommend that you use this
A template and an accompanying guide on why certain things are done the way they are is probably what I’m looking for. So that I understand more why it is done so, and not just for an Aurelia specific plugin but also for any package to be consumed by an Aurelia App.
I’ve seen a couple, but they seem to just stay on the simple “Hello World” side of things instead of something a bit more complicated.
As an example with the Skeleton Plugin, having a sub-directory in the src folder does not work well when being consumed, there are a couple TS issues with the module resolution, unless you use relative paths instead of absolute paths.
I have done some sort of plugins with what I have suggested above, value converters, custom elements,
attributes and so on, they are also include sub directories in src folder; it does not contain any documentation for how to use and configure though.
I could add more to the readme on how to use.
Made it a long time when I was creating the build setup for my vgrid for using typescript.
Grid uses fusebox for sample folder now though.
But if I dont remember wring its just ‘gulp watch’ for using it with sample project and ‘gulp build’ when you need to create new build in the dist folder.
I know very little about dotnet and have never used it, but Ive just updated the fuse-box-aurelia-seed, maybe that can help you getting started.
Its using the fuse-box-aurelia-loader and fuse-box-typechecker I created.
Loader is old webpack loader modified to use fusebox paths (without HMR)
HMR was kinda buggy so did not want it as a part of it, since hmr isnt something you use for production, more of a nice to have feature
Most fun (I think) is the fusebox-typechecker, it also do tslint and have some nice options like yellow text og tslint erros etc.
Name is kinda wrong now, since it does not need fusebox to work anymore.
