Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor: Upgrade app to Nuxt 3 #253

Merged
merged 101 commits into from
Aug 8, 2022
Merged

refactor: Upgrade app to Nuxt 3 #253

merged 101 commits into from
Aug 8, 2022

Conversation

Hanziness
Copy link
Owner

@Hanziness Hanziness commented Aug 8, 2022

This PR introduces a huge refactoring of the app as the underlying engine is upgraded from Nuxt 2 to Nuxt 3. The most noteworthy changes (most of these are not user-facing):

  • ⚠️ The app is now managed using pnpm instead of yarn. Please delete the previous node_modules folder, and reinstall using pnpm install --shamefully-hoist (this was reverted due to incompatibilities will full plug-and-play support and Netlify not supporting pnpm, see chore(dev): Revert package manager to yarn #257)
  • ⚠️ The settings store had a minor, but breaking, change (in how colours are stored), so the settings (but not the tasks) will be reset. For those who are using the develop branch: while the version in package.json is still on 1.2.0 the settings will reset on every page reload - this can be temporarily worked around by manually changing the version field in package.json to 1.3.0. This issue will automatically go away when 1.3.0 is released.
  • Layout transitions are temporarily disabled due to visual glitches (could be a Nuxt bug)
  • A bunch of dependencies have been removed, like Nuxt's PWA module (nuxt/pwa) (due to incompatibilities), thenuxt/image module and the nuxt/i18n module.
  • A proper range input has been introduced for numeric entries
  • The time input has also changed - it is experimental. You can switch between the minutes and seconds entry using the buttons next to the text input
  • Stores, plugins and some components have been moved over to TypeScript and refactored
  • Modules that were entirely rewritten have been converted to use Vue 3's Composition API and TypeScript. For now, some components are still using the old Options API. I plan to convert more components to the Composition API in the future as it provides much better type hinting.
  • Totally revamped settings controls which should be much easier to maintain
  • The ticker and notification controller was moved into a composable (they are not part of the DOM anymore) -- the notification controller will be later transformed into the web platform module (there will be a "mobile" module, too, stay tuned)
  • The PWA manifest and service worker are now manually generated, so the app can use the latest version of Workbox (most importantly v6 instead of v5), and proper offline pre-caching. Previously the service worker only cached items (like the settings panel or languages) that were loaded before going offline, now the service worker can download everything for offline use - so you can pretty much go offline after loading the page and stuff should just work!
  • The translations module is also manually integrated, making it easier to keep up-to-date.

Phew.

Closes #248

The timer page loads, but the layout transition doesn't work, there are invalid VNode types etc.
Note: the splash screen still does not disappear!
Note: it's still not working properly
This should indicate that the items are draggable
This gets rid of the warning that the plugin is using an old API
@Hanziness Hanziness merged commit 2a90418 into develop Aug 8, 2022
@Hanziness Hanziness deleted the experiment-nuxt-upgrade branch August 8, 2022 13:39
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Migrate to Nuxt 3
1 participant