fix(aws-amplify-react): BREAKING - Remove "import '@aws-amplify/ui/dist/style.css'" #5138

ericclemmons · 2020-03-18T20:09:06Z

This will require a MAJOR version bump, ideally with modularization.

Issue #, if available: Fixes #3348, fixes #3854, fixes #2230, fixes #3053. Related to #1613, but there's more work to be done to support categories in Next.js.

Importing non-JS files is invalid JavaScript, as it relies on a bundler (e.g. webpack) & breaks SSR for Next.js.

It works with CRA because CRA builds all dependencies, just-in-case.

Docs PR: aws-amplify/docs#1258

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

BREAKING - This coincides with aws-amplify/amplify-js#5138

codecov · 2020-03-18T20:19:24Z

Codecov Report

Merging #5138 into modularization will decrease coverage by 0.00%.
The diff coverage is n/a.

@@                Coverage Diff                 @@
##           modularization    #5138      +/-   ##
==================================================
- Coverage           75.85%   75.84%   -0.01%     
==================================================
  Files                 177      177              
  Lines                9682     9681       -1     
  Branches             1909     1909              
==================================================
- Hits                 7344     7343       -1     
  Misses               2187     2187              
  Partials              151      151

Impacted Files	Coverage Δ
...act/src/Amplify-UI/Amplify-UI-Components-React.tsx	`79.78% <ø> (-0.11%)`	⬇️

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 a81cdd7...b08b0fc. Read the comment docs.

Importing non-JS files relies on a bundler & breaks SSR. It works with CRA because CRA *builds all dependencies*, just-in-case.

sammartinez

LGTM 🌮

sawyerh · 2020-03-19T19:54:47Z

@ericclemmons @sammartinez Thanks for addressing this – it's been a major pain point for us on a Next.js app we're building. What would be the best way for us to start using the package with this change, while it's still pending a release candidate? This package being in a monorepo complicates this a bit.

ericclemmons · 2020-03-19T20:02:12Z

@sawyerh We're doing a major release in 1 or 2 business days which will contain this fix, as it's a breaking change.

(I'm investigating solutions for PR releases, but unfortunately that's not available yet.)

sawyerh · 2020-03-19T20:05:11Z

@ericclemmons That's really great to hear, thank you!

sawyerh · 2020-03-27T14:54:11Z

@ericclemmons Sorry to pester you – any update on timeline for this being released in some fashion?

sammartinez · 2020-03-27T16:19:26Z

@sawyerh We are looking to do a release in the coming weeks. Verifying final issues and will provide an update mid next week if something changes

@model

* Adding database abstraction for AsyncStorage * Add storage adapter for React Native using AsyncStorage * Add separate default adapters for Web and React Native * Make error messages more meaningful * Add support for Reachability in React Native * Add @react-native-community/netinfo to devDependencies * Pin down the version of crypto-js * Enable publish from rn-datastore branch * Preparing release * chore(release): Publish [ci skip] - @aws-amplify/[email protected] - [email protected] - [email protected] - [email protected] - @aws-amplify/[email protected] - @aws-amplify/[email protected] * Allow in PubSub to add async custom headers Allow in PubSub the same capabilities as API for custom headers: * Async header * Override headers (Authorization) Check issue #4928 for explanations. * chore(deps-dev): bump codecov from 1.0.1 to 3.6.5 (#4951) Bumps [codecov](https://github.com/codecov/codecov-node) from 1.0.1 to 3.6.5. - [Release notes](https://github.com/codecov/codecov-node/releases) - [Commits](https://github.com/codecov/codecov-node/commits) Signed-off-by: dependabot[bot] <[email protected]> * (fix:@aws-amplify/pubsub) Fix for unsubscription new subscription race condition (#4956) * Fix for unsubscription new subscription race condition * Update packages/pubsub/src/Providers/AWSAppSyncRealTimeProvider.ts * Fix to initialize only once and handle disconnection from network (#4921) * initialize only once * Fix onerror handler for WebSocket * Change log level for unsubscribe message * Add regions and fix typo * Handle disconnection * chore(deps): bump nokogiri from 1.10.4 to 1.10.8 in /docs (#4974) Bumps [nokogiri](https://github.com/sparklemotion/nokogiri) from 1.10.4 to 1.10.8. - [Release notes](https://github.com/sparklemotion/nokogiri/releases) - [Changelog](https://github.com/sparklemotion/nokogiri/blob/master/CHANGELOG.md) - [Commits](sparklemotion/nokogiri@v1.10.4...v1.10.8) Signed-off-by: dependabot[bot] <[email protected]> * Use the db instance property of the Adapter class for all database operations (#4995) Use the db instance property of the Adapter class for all database operations * Removing unused code * Remove rn-datastore branch publish config * Preparing release * chore(release): Publish [ci skip] - [email protected] - @aws-amplify/[email protected] - @aws-amplify/[email protected] - @aws-amplify/[email protected] - [email protected] - [email protected] - [email protected] - @aws-amplify/[email protected] - @aws-amplify/[email protected] - @aws-amplify/[email protected] - @aws-amplify/[email protected] - @aws-amplify/[email protected] - @aws-amplify/[email protected] - @aws-amplify/[email protected] - @aws-amplify/[email protected] - @aws-amplify/[email protected] * fix(core): move react-native dependency from dev * fix(core): revert dep addition. Add to peer and devDeps * ci: Add React Native integration testing with Detox (#5007) * Make deploy wait on integ_rn_ios_storage (#5009) * feat(@aws-amplify/api): pass additionalHeaders to graphql function (#5001) Additional headers are merged **after** merging in headers set at config time. Additional headers will overwrite any existing values and merge the rest. * chore(@aws-amplify/api): fix non-breaking typo in function (#5034) * fix(@aws-amplify/datastore): Fix query and delete types (#5032) Fixes #4827 * Fix(@aws-amplify/interactions) fixes 4750 to properly use the spread operator (#4806) * fix(@aws-amplify/datastore) Adding socket disconnection detection (#5086) * Export necessary providers and types from the package root to avoid importing from generated paths (#5085) * fix(aws-amplify-react): Fix Federated icons when using React Bo… (#5073) * Explicitly set box-sizing, as CSS resets override to border-box * Explicitly set line-height, as CSS resets override line-height * Upgrade aws-sdk clients which resolves react native issues (#5124) * Export necessary providers and types from the package root to avoid importing from generated paths * Upgrade aws-sdk clients which resolves react native issues * Enable integration tests on modularization branch (#5125) * chore: Fix setup-dev script (#5035) Let `unlink-all` succeed always Co-authored-by: Iglesias <[email protected]> * fix(@aws-amplify/datastore): Storage should be re-initialized after DataStore.clear() (#5083) * fix(@aws-amplify/datastore): Fix #5076 storage not re-initialized after DataStore.clear() * Adding comments Co-authored-by: Manuel Iglesias <[email protected]> Co-authored-by: Ashish Nanda <[email protected]> * fix(aws-amplify-react): BREAKING - Remove "import '@aws-amplify… (#5138) Importing non-JS files relies on a bundler & breaks SSR. It works with CRA because CRA *builds all dependencies*, just-in-case. * feat(@aws-amplify/datastore): Support non-@model types in DataStore (#5128) * Upgrade immer * Return sooner if predicates are empty * Fix bug when trying to delete a model instance that is not persisted * Support non-@model types * Generate datastore coverage report and RN integ test * Fix tslint error * Remove unit test case for onGetPost * Remove unused code * Rename instance initializer to initializeInstance * Rename SchemaType to SchemaNonModel * Rename types to nonModels in schema.js * Rename type to nonModel * Make nonModels optional in schema.js * Remove generic constraint from createTypeClass * Rename ModelOrTypeConstructorMap to TypeConstructorMap * Rename createModelAndTypeClassses to createTypeClasses * Rename createTypeClass to createNonModelClass * chore: remove datastore form RN integ tests (#5139) * Fix export type of datastore storage in unit tests * test(@aws-amplify/datastore): Fix unit tests * [RN] Migrate zen-observable to zen-observable-ts and fix zen-push import (#5155) * Migrate zen-observable to zen-observable-ts and fix zen-push import * Fix unit tests * Pin aws-sdk versions and rename presignRequest to presign (#5171) * Migrate zen-observable to zen-observable-ts and fix zen-push import * Fix unit tests * Pin aws-sdk versions and rename presignRequest to presign * Upgrade aws-sdk clients from alpha to beta (#5209) * Migrate zen-observable to zen-observable-ts and fix zen-push import * Fix unit tests * Pin aws-sdk versions and rename presignRequest to presign * Upgrade aws-sdk clients from alpha to beta * Update expiration type to Date as per change in aws-sdk * Fix unit tests as per expiration type change * Fix jest failures, update snapshot * Update storage changelog Co-authored-by: Ashish Nanda <[email protected]> Co-authored-by: Rodriguez Elorza <[email protected]> Co-authored-by: aws-amplify-bot <[email protected]> Co-authored-by: Sebastien Schwartz <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Manuel Iglesias <[email protected]> Co-authored-by: Ivan Artemiev <[email protected]> Co-authored-by: Jens Bodal <[email protected]> Co-authored-by: Ashika <[email protected]> Co-authored-by: Manuel Iglesias <[email protected]> Co-authored-by: Praveen Gupta <[email protected]> Co-authored-by: Eric Clemmons <[email protected]> Co-authored-by: Iglesias <[email protected]> Co-authored-by: Yirako <[email protected]> Co-authored-by: [email protected] <[email protected]>

github-actions · 2021-06-11T20:05:40Z

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.

ericclemmons added this to the Support SSR (Auth + API) milestone Mar 18, 2020

ericclemmons self-assigned this Mar 18, 2020

ericclemmons added React React related issues React Native React Native related issue SSR Issues related to Server Side Rendering and removed React Native React Native related issue labels Mar 18, 2020

ericclemmons added a commit to aws-amplify/docs that referenced this pull request Mar 18, 2020

Add instructions for adding default styles

d968807

BREAKING - This coincides with aws-amplify/amplify-js#5138

ericclemmons mentioned this pull request Mar 18, 2020

Add instructions for adding default styles aws-amplify/docs#1258

Merged

ericclemmons changed the base branch from master to modularization March 18, 2020 20:56

ericclemmons changed the base branch from modularization to master March 18, 2020 20:57

sammartinez requested a review from Amplifiyer March 18, 2020 21:03

Remove "import '@aws-amplify/ui/dist/style.css'", as it's not valid

b08b0fc

Importing non-JS files relies on a bundler & breaks SSR. It works with CRA because CRA *builds all dependencies*, just-in-case.

ericclemmons force-pushed the next.js branch from de0dd4c to b08b0fc Compare March 18, 2020 21:10

ericclemmons requested review from Ashish-Nanda, elorzafe, iartemiev, jordanranz, manueliglesias and sammartinez as code owners March 18, 2020 21:10

ericclemmons changed the base branch from master to modularization March 18, 2020 21:11

sammartinez approved these changes Mar 18, 2020

View reviewed changes

ericclemmons merged commit 1cad8b9 into aws-amplify:modularization Mar 18, 2020

ericclemmons deleted the next.js branch March 18, 2020 22:08

pharcosyle mentioned this pull request Apr 2, 2020

A javascript file with a webpack-style css import breaks shadow-cljs build thheller/shadow-cljs#598

Closed

ericclemmons mentioned this pull request Apr 7, 2020

Next.js project fails to build, Unexpected token : at dist/style.css #3854

Closed

ericclemmons mentioned this pull request Apr 20, 2020

Server-Side Rendering (SSR) with Next.js #5435

Closed

7 tasks

github-actions bot locked as resolved and limited conversation to collaborators Jun 11, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

fix(aws-amplify-react): BREAKING - Remove "import '@aws-amplify/ui/dist/style.css'" #5138

fix(aws-amplify-react): BREAKING - Remove "import '@aws-amplify/ui/dist/style.css'" #5138

ericclemmons commented Mar 18, 2020 •

edited

Loading

codecov bot commented Mar 18, 2020 •

edited

Loading

sammartinez left a comment

sawyerh commented Mar 19, 2020

ericclemmons commented Mar 19, 2020

sawyerh commented Mar 19, 2020

sawyerh commented Mar 27, 2020

sammartinez commented Mar 27, 2020

github-actions bot commented Jun 11, 2021

fix(aws-amplify-react): BREAKING - Remove "import '@aws-amplify/ui/dist/style.css'" #5138

fix(aws-amplify-react): BREAKING - Remove "import '@aws-amplify/ui/dist/style.css'" #5138

Conversation

ericclemmons commented Mar 18, 2020 • edited Loading

codecov bot commented Mar 18, 2020 • edited Loading

Codecov Report

sammartinez left a comment

Choose a reason for hiding this comment

sawyerh commented Mar 19, 2020

ericclemmons commented Mar 19, 2020

sawyerh commented Mar 19, 2020

sawyerh commented Mar 27, 2020

sammartinez commented Mar 27, 2020

github-actions bot commented Jun 11, 2021

ericclemmons commented Mar 18, 2020 •

edited

Loading

codecov bot commented Mar 18, 2020 •

edited

Loading