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

feat(@aws-amplify/ui-vue): Use @aws-amplify/ui-components for Vue 3 #7634

Merged
merged 9 commits into from
Feb 1, 2021

Conversation

wlee221
Copy link
Contributor

@wlee221 wlee221 commented Jan 28, 2021

Issue #, if available: #6756, #7456

Description of changes: We will now use @aws-amplify/ui-components to support Vue 3 and onwards. Vue 2 users can keep using @aws-amplify/ui-vue. This PR creates warning mechanisms whenever user tries to use ui-vue with Vue 3.

Background

Vue 3 brings major API changes such that it's hard to configure both Vue 2 and Vue 3 inside the same package:

  1. Global export Vue is now deprecated.
  2. ignoredElement is renamed to isCustomElement and can no longer be configured from library side.
  3. ui-vue package will be harder to maintain as we to adapt to future versions of Vue.

For these reasons, we'll instruct the customers to use @aws-amplify/ui-components instead. Documentation updates are tracked in aws-amplify/docs#2880

PR Changes

This PR creates warning mechanisms for using ui-vue on Vue 3 app:

  • Throw an error if Vue 3 App calls import '@aws-amplify/ui-vue'
  • Add peer dependency of "Vue": "2.x.x" to @aws-amplify/ui-vue

In addition, we run integration tests for vue 3 samples we are adding in https://github.com/aws-amplify/amplify-js-samples-staging/pull/192.

Screenshots

On yarn and npm 6

Installing ui-vue on Vue 3 gives a warning:

Screen Shot 2021-01-27 at 4 17 57 PM

If customer serves that app, this will show an error on console:

Screen Shot 2021-01-27 at 4 21 43 PM

On npm 7

Installing ui-vue on Vue 3 fails (which is really nice!).

Screen Shot 2021-01-27 at 4 29 57 PM

By submitting this pull request, I confirm that my contribution is made under the terms of the Apache 2.0 license.

@wlee221 wlee221 changed the title feat(@aws-amplify/ui-vue): Use @aws-amplify/ui-components for Vue 3 feat(@aws-amplify/ui-vue): Use @aws-amplify/ui-components for Vue 3 Jan 28, 2021
@codecov
Copy link

codecov bot commented Jan 28, 2021

Codecov Report

Merging #7634 (2f3fb20) into main (08277af) will not change coverage.
The diff coverage is n/a.

Impacted file tree graph

@@           Coverage Diff           @@
##             main    #7634   +/-   ##
=======================================
  Coverage   74.10%   74.10%           
=======================================
  Files         214      214           
  Lines       13405    13405           
  Branches     2626     2626           
=======================================
  Hits         9934     9934           
  Misses       3272     3272           
  Partials      199      199           

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 08277af...2f3fb20. Read the comment docs.

@wlee221 wlee221 marked this pull request as ready for review January 29, 2021 19:16
@wlee221 wlee221 requested a review from iartemiev as a code owner January 29, 2021 19:16
Copy link
Contributor

@sammartinez sammartinez left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 🌮

@sammartinez sammartinez merged commit 5574d95 into main Feb 1, 2021
@wlee221 wlee221 deleted the vue3/main branch February 10, 2021 15:51
dgonsan pushed a commit to dgonsan/amplify-js that referenced this pull request Mar 18, 2021
…aws-amplify#7634)

* Add Vue 3 Integration tests

* Add warning message for Vue 2

* Try adding peer dependency

* throw error instead

* Fix whitespace

Co-authored-by: Sam Martinez <samlmar@amazon.com>
@github-actions
Copy link

This pull request has been automatically locked since there hasn't been any recent activity after it was closed. Please open a new issue for related bugs.

Looking for a help forum? We recommend joining the Amplify Community Discord server *-help channels or Discussions for those types of questions.

@github-actions github-actions bot locked as resolved and limited conversation to collaborators Feb 11, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants