ghiscoding
Aurelia 2 support
I'm submitting a Feature request
Are there plans to upgrade to Aurelia 2?
I have yet to even try Aurelia 2 and I have no clue what needs to be done to upgrade my lib to support Au2. What would be great is that someone creates a PR with the required changes or at least explain what needs to be done to migrate a plugin to Au2.
@MaximBalaganskiy Today is the day, Aurelia-Slickgrid v7.0 now requries Aurelia 2. Again a big thanks for the help to migrate to Au2, it would not have been possible with your help 🤝 🥇
I also published all the Wikis to a new Documentation website by using GitBook (kinda got the idea from Aurelia Docs actually)
However, I still have to update all the demos, I guess I'll delete most of them and keep only WebPack since I guess RequireJS is out the door with Au2, I wish that Aurelia 2 would have better Vite support in the future.
@ghiscoding Nice! Appreciate your effort! Au2 future is getting brighter with this plugin :)
@MaximBalaganskiy
hey I'm actually having a problem with the live demo website on GitHub, I change the base path to empty string but it still fill in the base href="/" which is wrong on GitHub and it needs to be base href="", isnt't that what the basePath supposed to do?
It's getting late and I'll check that a bit more tomorrow but for now, I have to manually change it into my gh-pages branch and the remove the slash manually. I would hope to fix the automatic code published without the slash in the future
didn't work either, same result. I'll post a comment on discourse
oh wait, I think it might be with basePath: './' instead...nope again same result :(
try specifuying the subfolder where github puts it, i think I've done that before with mdc lib. Like basePath: '/aurelia-slickgrid'
Did you try switching to hash urls? useUrlFragmentHash: true.
This definitely works for MDC au2 bridge
RouterConfiguration.customize({ useUrlFragmentHash: true, useHref: false })
nope still the same result with a slash and I tried your suggestion with /aurelia-slickgrid and it still breaks the website, it really has be an empty string it seems
that didn't work for me but maybe I was something different in my webpack config that keeps adding the slash
Have a look at my demo app, may be something can be picked https://github.com/aurelia-ui-toolkits/aurelia-mdc-web/tree/v2/packages/app
ahhh I found the issue, in my index.html, there a static base href defined, when even though I thought that it was added by WebPack, that wasn't the case...oops
so you also have a base href defined in yours but you set it to empty. another thing that is different is that you are using index.ejs and I used to have that in my previous Au1 but you converted it to index.html in the Au2 PR so I taught ejs were no longer working... anyway, I can take another tomorrow, at least I got it working :)
I guess that's the default template that the new Au2 CLI produces, I'll convert it back to .ejs then
Thanks for the help
EDIT
yup that worked fine after converting it back to index.ejs and using base url set in webpack config
@MaximBalaganskiy Hey to bother you again, so I'm trying to upgrade the demo and keep only the WebPack demo but it's not going so well. I'm getting problem loading the Aurelia-Slickgrid plugin at all. The project is working fine as standalone but when trying to load it externally, some of the DI aren't getting loaded. Would you have clue or pointer of what the problem might be? Is it my demo conversion (I didn't use the CLI, I just tried to convert by hand), or is it something else? I've opened a PR in the demo project here and below is a video of what the DI currently loads. I'm a little unfamiliar with the new plugin approach in Au2
I might have released v7 a little too early, oh well... I was thinking about possibly using pnpm workspaces in the future to properly separate the lib from the demo and, that might be a good time to work on that.
I think you're not building the plugin correctly. It either has to be a webpack build, as CLI scaffolds it, or you need to bend over your back with gulp (as I did, and regret it now).
You cannot just tsc everything and copy html, not with AU2. The reason being, html now is compiled into a html.js file, and imported into the VM file. This is all done by a webpack plugin. Like I said, you can do it manually with some gulp scripts but I would not recommend that
The way I had it in my initial conversion branch is the right way to do it.
hmm I reverted some code in this commit because all the Types were missing, does that previous include the code you were expecting then? It still seems like tsc build though
It was in the very first branch where I basically started a new plugin with CLI. Later I switched to updating your branch
Also, a hint, add this file to your projects to avoid TS html errors https://github.com/aurelia-ui-toolkits/aurelia-mdc-web/blob/v2/packages/app/src/resource.d.ts
Here is that very first branch https://github.com/MaximBalaganskiy/aurelia-slickgrid/tree/au2 It uses webpack to build the plugin
ok great that's helpful, I think I'll definitely have to go with the pnpm workspace to make sure it all works correctly. Thanks a lot for all these infos
Not sure about pnpm, normal npm works just fine with workspaces. But that's really unrelated. The main issue is the build script of the plugin
Not sure about
pnpm, normal npm works just fine with workspaces. But that's really unrelated. The main issue is the build script of the plugin
So I went ahead and started migrating to pnpm workspaces (I've opened a new PR), the reason is mostly because when using the workspace:, it uses the build folder (dist) and the real project package.json with its main with all exports, types and everything. It's pretty much like if we were doing an npm install with dist install and all but instead, it's all happening locally without having to publish anything... So it's really good to test plugin build and such, with that approach I got further but it's not quite there yet. I'm having some issues with the WebPack plugin build and I also tried running similar build with esbuild and the result is quite similar but not exactly the same.
with WebPack I'm getting this error Error: IAurelia
with esbuild I'm getting this error Error: IDirtyChecker
The next step I've done was to look at cloning the old commit you've referenced and trying it out, which is this commit and you said it works, but that's not entirely true, it does work running it from the src/index but it doesn't work if you run the build and change the dev-app/main.ts with the code shown below.
- import * as Plugin from "../src/index";
+ import * as Plugin from "../dist/index"; // use build from dist
Aurelia
.register(I18nConfiguration, Plugin, RouterConfiguration.customize({ useHref: false }), Example19DetailView, Example19Preload)
.register(DecimalValueConverter, StringifyValueConverter, DateFormatValueConverter)
.app(MyApp)
.start();
with this I'm getting the exact same error as above with my code that is up to date, I'm getting Error: IAurelia and I don't really what to do to go further. The stack trace is coming from Aurelia, so there 0 info to help. You can try it yourself from your old commit and see for yourself. Any more suggestions on what else to do so that I can get over this error? In Aurelia 1, we had to use different code when we were publishing the plugin on npm vs when we were using a plugin locally (use.feature vs use.plugin). I think in Aurelia 2 they removed these 2 approaches but I really wonder if there's isn't something similar causing the issue shown above
This seems to have something to do with duplicate Aurelia imports. Not sure how to correctly generate mjs modules with webpack. Spent the whole day playing with vite and advanced to a point where slickgrid does not want to create an instance because container is not in the DOM.