I was an earlier adopter of Aurelia (having been a big fan of Rob’s work with caliburn-micro and durandal) and I used it for several projects early on. I’ve since spent time on other projects using other technologies and frameworks and recently started looking at Aurelia again and wanted to catch up on everything that is new since version 1.0. This is a summary of my experiences with Aurelia CLI.
Using the CLI seems super straight forward at the start. I like typescript and webpack, I choose the default typescript configuration:
Name: aurelia2 Platform: Web Bundler: Webpack Loader: None Transpiler: TypeScript Markup Processor: Minimal Minification CSS Processor: None Unit Test Runner: Jest Unit Test Runner: Karma Integration Test Runner: None Editor: Visual Studio Code
I choose ‘yes’ to install dependencies, and after a few minutes I’m informed that everyhing was successful and I just need to
au run. So I
CD into my new project folder and
After a few minutes of confusion I scroll up in my command window and spot the localhost:8080 address that it’s running at, and attempt to navigate to that address. And I’ve hit an error:
i ｢wdm｣: wait until bundle finished: /app.cc8a8d75bf6df504bd61.bundle.js i ｢wdm｣: wait until bundle finished: /vendor.cc8a8d75bf6df504bd61.bundle.js × ｢wdm｣: ConcurrentCompilationError: You ran Webpack twice. Each instance only supports a single concurrent compilation at a time.
Crap. Ok, I google the error and find the issue:
Ok, so apparently there’s a bug that’s been around for a few weeks that breaks
au run. The workaround is to use the --watch flag. So i do that, and I’m up and running with the basic skeleton.
The next thing I want to do is test out this library:
https://www.npmjs.com/package/aurelia-dragula. I’m not really sure what the best way to install this library is, but
aurelia install informs me that it can only help me if I’m using the Aurelia CLI Bundler. Fair enough, I guess that makes sense since I’m using webpack - so I assume I’ll be installing this library in the same way I install things in other webpack projects that I’ve done. (Note: this only makes sense to me, because I have familiarity with both webpack, and earlier aurelia versions/patterns/practices)
npm install aurelia-dragula --save
Which shows a bunch of log messages, and finishes with the following summary:
+ firstname.lastname@example.org added 1 package and removed 2630 packages in 69.016s
wait… what?! why were 2630 packages removed? I try
au run --watch, and get the following error:
Invalid Command: run
At this point I have no idea what I’ve done wrong, or why
au run is no longer a valid command. I’ve apparently done something to ruin or corrupt the project in this folder, but I don’t understand why installing a library did that.
A lot of time googling yields no results, so eventually I theorize that maybe I wasn’t supposed to use NPM to install, maybe I should have used yarn. So I completely start over with a new project and this time I use
yarn add aurelia-dragula instead.
That apparently was the issue, and with the appropriate
aurelia.use statement, I was able to get the aurelia-dragula library working.
That brings me to where I am now: frustrated and deflated with all of the snags and issues I hit just getting started with aurelia CLI. It makes me wonder: is this what I should be expecting with the rest of the Aurelia ecosystem?
TLDR list of issues:
- Given that the current CLI has a default preference for webpack 4, this means that the documentation is largely irrelevant: http://aurelia.io/docs/build-systems/aurelia-cli#machine-setup
- At the least, the basic
au runreally ought to work without errors. I’d also recommend finding a way to better highlight the address it’s being hosted at
- I’m not sure why
npm installmessed up the works, but it would be nice if
auwould provide some kind of helpful error when… whatever happened, happens.
I’ve always been an advocate of Aurelia and I hope this message comes off as constructive rather than just criticizing.