This repository has been archived by the owner on Dec 3, 2021. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
Use Vite as our build service #8
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
padarom
force-pushed
the
vite
branch
2 times, most recently
from
April 8, 2021 21:58
149b957
to
74b7375
Compare
padarom
force-pushed
the
vite
branch
3 times, most recently
from
April 9, 2021 22:22
5606894
to
c44d2fc
Compare
Added the Vite build function for our `awtrix pack` command. At the moment it only packs the `frontend.vue` file. Vue 3 SFCs are simpler than in Vue 2, so some logic on rendering FrontendApps generator functions has been adjusted as well.
padarom
force-pushed
the
vite
branch
2 times, most recently
from
April 14, 2021 14:06
c5b1def
to
4b370a4
Compare
Blueforcer
approved these changes
Apr 15, 2021
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good to me so far :)
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR migrates away from Nuxt and directly to a Vite-powered Vue service. There's multiple additional improvements under the hood:
@awtrix/dev
We got rid of the
@awtrix/dev
package in order to provide a centralizedawtrix
binary, rather than also addingawtrix-dev
. Theawtrix
binary now includes commands to pack, init and run custom apps.This however means that we have to move dev dependencies to regular dependencies as they are necessary for building custom apps. This increases bundle size and install time for non-developers, that just want to run
awtrix start
, but I think this is worth it for a more streamlined development experience; especially given that you only really have to install Awtrix once on your Raspberry, so an additional minute and maybe 50MB shouldn't matter too much.Switch from Oclif to yargs
Oclif comes with a lot of overhead as it does its own parsing of the project structure to determine command availability. This has annoyed me multiple times so far, as the entirety of its error handling is silent and I constantly had to debug why a command was suddenly not available anymore. Also, this seems to have made constant trouble with TS/JS interoperability.
yargs is a bit more verbose to use and doesn't come with as great typing as Oclif, but works just as well for our purposes.
Nuxt -> Vite
A switch from Nuxt was necessary for using Vite, since Vite only supports Vue 3, while Nuxt doesn't yet. Since we essentially only have a single page (ignoring a desktop configuration option) we don't get much benefit from using Nuxt anyways, therefore this is also removing a bit of complexity. It does mean however that have more power over how exactly our Vue app is initialized.
The switch to Vite also allows us to use the Typescript-compatible Vite features programatically, such as spawning a development server, building awtrix itself for production, or building only a specific Awtrix HD app (potentially also with HMR functionality).
esbuild
I'm also migrating from
tsc
toesbuild
, which drastically improves Typescript build time. It's what Vite uses under the hood and one of the main reasons it's so much faster than a Nuxt compile.A caveat is that esbuild simply transpiles and doesn't perform any type checking, so we still have to run
tsc --noEmit
in parallel to provide type safety, while usingesbuild
to generate a JS bundle.Todo
FrontendApp
andcreateFrontend
function in@awtrix/common
awtrix pack
awtrix pack
support for TS backends, assets and translationsawtrix dev
tsc --noEmit
in parallelHMR/restarting (via nodaemon?) for the backendDetermine if we can redo enable hot reload #2 by using the Vite dev server forawtrix dev
instead of a watching build modenpm run ...
(dev) andawtrix ...
(production) functionality