[Breaking changes] Bump several major dependencies #2041

emmenko · 2021-02-04T15:54:31Z

Follow up of #1874

This PR now contains several major dependency updates, resulting in releasing a new major of appkit due to the nature of peer dependencies and the major library upgrades.

More specifically:

React v17 is required now
Several other peer deps cleanups, mainly to drop old versions.
Using uikit v12
Using webpack v5
Using graphql v15
Using docskit v16 (gatsby v3)

The appkit packages don't contain any breaking changes.

vercel · 2021-02-04T15:54:33Z

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/commercetools/merchant-center-application-kit/EHxwSkxdA6BGaavpSMW4Cg21aVuj
✅ Preview: https://merchant-center-application-kit-git-nm-webpack-5-commercetools.vercel.app

changeset-bot · 2021-02-04T15:54:33Z

🦋 Changeset detected

Latest commit: b8777c2

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 23 packages

Name	Type
playground	Major
@commercetools-frontend/create-mc-app	Major
@commercetools-frontend/application-shell-connectors	Major
@commercetools-frontend/mc-html-template	Major
@commercetools-local/visual-testing-app	Major
merchant-center-application-template-starter	Major
@commercetools-frontend/l10n	Major
@commercetools-frontend/permissions	Major
@commercetools-frontend/react-notifications	Major
@commercetools-frontend/actions-global	Major
@commercetools-frontend/jest-stylelint-runner	Major
@commercetools-frontend/mc-dev-authentication	Major
@commercetools-frontend/sentry	Major
@commercetools-frontend/jest-preset-mc-app	Major
@commercetools-frontend/sdk	Major
@commercetools-frontend/application-shell	Major
@commercetools-frontend/application-components	Major
@commercetools-frontend/application-config	Major
@commercetools-frontend/i18n	Major
@commercetools-frontend/mc-scripts	Major
@commercetools-website/custom-applications	Major
@commercetools-website/components-playground	Major
@commercetools-frontend/cypress	Major

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

emmenko · 2021-02-05T10:37:04Z

FYI: the production bundle seem to work but it's the dev server that has problems.

emmenko · 2021-03-16T08:06:07Z

Note: re-enable website into workspaces once we are able to upgrade to Webpack v5

emmenko · 2021-03-31T14:23:52Z

Update: things look good now, I was able to start dev server locally and to build the production app.

tdeekens

Ouuuuh very exciting! Thanks 🙇‍♀️

tdeekens · 2021-03-31T21:48:25Z

packages/mc-scripts/src/build.js

 const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
 const FileSizeReporter = require('react-dev-utils/FileSizeReporter');
 const printBuildError = require('react-dev-utils/printBuildError');
+// const formatWebpackMessages = require('./patches/react-dev-utils/formatWebpackMessages');


Do we need this 🤔?

it's redundant to L19

tdeekens · 2021-03-31T21:49:06Z

packages/mc-scripts/src/config/create-webpack-config-for-development.js

@@ -380,6 +379,8 @@ module.exports = function createWebpackConfigForDevelopment(options = {}) {
            },
          ],
          include: mergedOptions.sourceFolders.concat(vendorsToTranspile),
+          // Disable require.ensure as it's not a standard language feature.


tdeekens · 2021-04-09T08:30:20Z

.changeset/angry-parrots-begin.md

+'playground': major
+---
+
+Ships with `react@17`


Now uses react@17 and react-dom@17.

tdeekens · 2021-04-09T08:30:42Z

.changeset/brave-chairs-listen.md

+'@commercetools-frontend/create-mc-app': major
+---
+
+- Change required engine version to `>=12 || >=14`.


Suggested change

- Change required engine version to `>=12 || >=14`.

- Changes required Node.js engine version to `>=12 || >=14` in `package.json`.

tdeekens · 2021-04-09T08:31:04Z

.changeset/brown-cows-sparkle.md

+
+- Requires a peer dependency of `react@17`.
+- The `@types/react*` peer dependencies have been removed and included as normal dependencies with a minor range version.
+- Change required engine version to `>=12 || >=14`.


Suggested change

- Change required engine version to `>=12 || >=14`.

- Change required Node.js engine version to `>=12 || >=14` in `package.json`.

tdeekens · 2021-04-09T08:31:15Z

.changeset/chatty-houses-shave.md

+'@commercetools-frontend/mc-html-template': major
+---
+
+- Change required engine version to `>=12 || >=14`.


Suggested change

- Change required engine version to `>=12 || >=14`.

- Change required Node.js engine version to `>=12 || >=14` in `package.json`.

tdeekens · 2021-04-09T08:31:32Z

.changeset/clever-monkeys-invite.md

+'@commercetools-local/visual-testing-app': major
+---
+
+Ships with `react@17`


Suggested change

Ships with `react@17`

Ships with `react@17`Now uses react@17 and react-dom@17.

tdeekens · 2021-04-09T08:31:48Z

.changeset/clever-wombats-teach.md

+'merchant-center-application-template-starter': minor
+---
+
+- Ships template with `react@17`.


Suggested change

- Ships template with `react@17`.

Now uses react@17 and react-dom@17.

tdeekens · 2021-04-09T08:32:16Z

.changeset/little-wasps-push.md

+'@commercetools-frontend/mc-dev-authentication': major
+---
+
+- Change required engine version to `>=12 || >=14`.


Suggested change

- Change required engine version to `>=12 || >=14`.

- Change required Node.js engine version to `>=12 || >=14` in `package.json`.

tdeekens · 2021-04-09T08:32:31Z

.changeset/quiet-glasses-smell.md

+- The `@types/react*` peer dependencies have been removed and included as normal dependencies with a minor range version.
+- The peer dependency `react-intl` now only requires version `>=5`.
+- The peer dependency `@testing-library/react` now only requires version `>=11`.
+- Change required engine version to `>=12 || >=14`.


Suggested change

- Change required engine version to `>=12 || >=14`.

- Change required Node.js engine version to `>=12 || >=14` in `package.json`.

tdeekens · 2021-04-09T08:32:45Z

.changeset/sweet-jeans-draw.md

+'@commercetools-frontend/mc-scripts': major
+---
+
+- Change required engine version to `>=12 || >=14`.


Suggested change

- Change required engine version to `>=12 || >=14`.

- Change required Node.js engine version to `>=12 || >=14` in `package.json`.

tdeekens · 2021-04-09T08:33:01Z

.changeset/tricky-wolves-lick.md

+'@commercetools-frontend/application-config': major
+---
+
+- Change required engine version to `>=12 || >=14`.


Suggested change

- Change required engine version to `>=12 || >=14`.

- Change required Node.js engine version to `>=12 || >=14` in `package.json`.

adnasa

Let's spin this locally, one time.

Regarding the UI-kit upgrade, we'll run into conflicts.
either the ui-kit upgrade goes first or this PR. I'm fine with either, but perhaps it's easier that this PR goes first.

adnasa · 2021-04-09T08:21:40Z

package.json

@@ -6,7 +6,7 @@
  "private": true,
  "scripts": {
    "prepare": "husky install",
-    "postinstall": "manypkg check && preconstruct dev && yarn compile-css-modules && yarn --cwd website && yarn --cwd website-components-playground",
+    "postinstall": "manypkg check && preconstruct dev && yarn compile-css-modules",


packages/mc-scripts/src/patches/react-dev-utils/formatWebpackMessages.js

+  if (result.errors.some(isLikelyASyntaxError)) {
+    // If there are any syntax errors, show just them.
+    result.errors = result.errors.filter(isLikelyASyntaxError);
+  }
+  return result;


adnasa · 2021-04-09T08:24:59Z

packages/mc-scripts/src/build.js

 const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
 const FileSizeReporter = require('react-dev-utils/FileSizeReporter');
 const printBuildError = require('react-dev-utils/printBuildError');
+// const formatWebpackMessages = require('./patches/react-dev-utils/formatWebpackMessages');


it's redundant to L19

adnasa · 2021-04-09T08:25:47Z

packages/mc-scripts/src/config/create-webpack-config-for-development.js

    infrastructureLogging: {
-      level: 'warn',
+      level: 'none',
    },


This isn't the same as removing the option?

adnasa · 2021-04-09T08:29:21Z

@types/commercetools-uikit__link/index.d.ts

+  export type LinkProps = {
+    tone?: 'primary' | 'inverted';
+    isExternal?: boolean;
+    to?: string | H.LocationDescriptor;


🔥 yesssssssss

There is a PR for Link to TS on ui-kit..
this won't last long

adnasa · 2021-04-09T08:30:58Z

website-components-playground/package.json

+    "@commercetools-uikit/design-system": "^11.2.1",
+    "@commercetools-uikit/icon-button": "^11.2.1",
+    "@commercetools-uikit/icons": "^11.2.1",
+    "@commercetools-uikit/multiline-text-field": "^11.3.0",
+    "@commercetools-uikit/secondary-button": "^11.2.1",
+    "@commercetools-uikit/select-field": "^11.2.1",
+    "@commercetools-uikit/spacings": "^11.2.1",
+    "@commercetools-uikit/text": "^11.2.1",
+    "@commercetools-uikit/text-field": "^11.2.1",
+    "@commercetools-uikit/text-input": "^11.2.1",


okay we will have conflicts.
I'm fine with merging this PR first then updating ui-kit on top of that.

* chore: upgrade ui-kit * refactor(types): add new horizontalConstraint map, add `design-system` module * refactor(playground): remove old use of props * refactor(application-components): remove use of old props * refactor(visual-testing-app): remove use of old props * chore: changeset * chore: upgrade to latest docs-kit (includes uikit v12) * fix: remove unnecessary types, fix constraints Co-authored-by: Nicola Molinari <[email protected]>

adnasa

🚀

emmenko added 🖐 Status: On Hold 🚧 Status: WIP Work in progress labels Feb 4, 2021

This was referenced Feb 8, 2021

fix(deps): update dependency html-webpack-plugin to v5 #2045

Closed

fix(deps): update dependency postcss-loader to v5 #2046

Closed

This was referenced Mar 12, 2021

chore: upgrade docs-kit to 15 #2093

Closed

chore: upgrade to docs-kit v15 #2095

Merged

emmenko force-pushed the nm-webpack-5 branch from e0a8900 to 730b674 Compare March 31, 2021 14:22

vercel bot temporarily deployed to Preview March 31, 2021 14:22 Inactive

emmenko mentioned this pull request Mar 31, 2021

chore: re-add websites into workspaces to see if production bug still persists #2108

Closed

vercel bot temporarily deployed to Preview March 31, 2021 20:24 Inactive

tdeekens reviewed Mar 31, 2021

View reviewed changes

emmenko added 5 commits April 8, 2021 11:57

refactor: migrate to webpack v5

9e7ec37

refactor: chore: re-add websites into workspaces

02b8e6d

refactor: migrate webpack-dev-server

39e9715

chore: remove patch file

4e5a920

refactor: sync config with CRA

42fdf60

emmenko force-pushed the nm-webpack-5 branch from 098a72a to 42fdf60 Compare April 8, 2021 10:17

vercel bot temporarily deployed to Preview April 8, 2021 10:17 Inactive

fix(mc-scripts): load correct browserslist config based on environment

757f8c0

vercel bot temporarily deployed to Preview April 8, 2021 11:26 Inactive

emmenko added 3 commits April 8, 2021 15:20

refactor(mc-scripts): small improvements

e34e0d2

refactor: simplify and drop old peer dep versions

664412e

fix: hmr

3296b6f

vercel bot had a problem deploying to Preview April 8, 2021 14:03 Failure

fix: lockfile

6ab4a15

vercel bot temporarily deployed to Preview April 8, 2021 14:12 Inactive

chore: regenerate types and schema

2022b06

emmenko mentioned this pull request Apr 8, 2021

chore: upgrade graphql to v15 #2010

Closed

emmenko added 💥 Type: Breaking Change and removed 🖐 Status: On Hold 🚧 Status: WIP Work in progress labels Apr 8, 2021

emmenko changed the title ~~[WIP] Migrate to Webpack 5~~ [Breaking changes] Bump several major dependencies Apr 8, 2021

docs: add comment

9c85af8

vercel bot temporarily deployed to Preview April 8, 2021 14:25 Inactive

emmenko added 2 commits April 8, 2021 16:44

docs: add changesets

07502ed

fix: missing Link component types

120292d

vercel bot temporarily deployed to Preview April 8, 2021 14:55 Inactive

emmenko marked this pull request as ready for review April 8, 2021 15:41

emmenko requested review from tdeekens and adnasa April 8, 2021 15:41

chore: upgrade docskit to v16

2c68d95

vercel bot temporarily deployed to Preview April 8, 2021 15:48 Inactive

tdeekens approved these changes Apr 9, 2021

View reviewed changes

adnasa approved these changes Apr 9, 2021

View reviewed changes

adnasa mentioned this pull request Apr 9, 2021

chore: upgrade ui-kit to v12 #2131

Merged

vercel bot temporarily deployed to Preview April 9, 2021 13:42 Inactive

adnasa approved these changes Apr 9, 2021

View reviewed changes

docs: improve changesets

b8777c2

vercel bot temporarily deployed to Preview April 9, 2021 14:39 Inactive

emmenko merged commit a240f65 into main Apr 9, 2021

emmenko deleted the nm-webpack-5 branch April 9, 2021 15:15

emmenko mentioned this pull request Apr 9, 2021

v19 release notes #2132

Merged

ghost mentioned this pull request Apr 9, 2021

Version Packages #2130

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Breaking changes] Bump several major dependencies #2041

[Breaking changes] Bump several major dependencies #2041

emmenko commented Feb 4, 2021 •

edited

Loading

vercel bot commented Feb 4, 2021 •

edited

Loading

changeset-bot bot commented Feb 4, 2021 •

edited

Loading

emmenko commented Feb 5, 2021

emmenko commented Mar 16, 2021

emmenko commented Mar 31, 2021

tdeekens left a comment

tdeekens Mar 31, 2021

adnasa Apr 9, 2021

tdeekens Mar 31, 2021

tdeekens Apr 9, 2021

tdeekens Apr 9, 2021

tdeekens Apr 9, 2021

tdeekens Apr 9, 2021

tdeekens Apr 9, 2021

tdeekens Apr 9, 2021

tdeekens Apr 9, 2021

tdeekens Apr 9, 2021

tdeekens Apr 9, 2021

tdeekens Apr 9, 2021

adnasa left a comment •

edited

Loading

adnasa Apr 9, 2021

This comment was marked as outdated.

adnasa Apr 9, 2021

adnasa Apr 9, 2021

adnasa Apr 9, 2021

adnasa Apr 9, 2021

adnasa left a comment

	- Change required engine version to `>=12 \|\| >=14`.
	- Changes required Node.js engine version to `>=12 \|\| >=14` in `package.json`.

	- Change required engine version to `>=12 \|\| >=14`.
	- Change required Node.js engine version to `>=12 \|\| >=14` in `package.json`.

	Ships with `react@17`
	Ships with `react@17`Now uses react@17 and react-dom@17.

	- Ships template with `react@17`.
	Now uses react@17 and react-dom@17.

[Breaking changes] Bump several major dependencies #2041

[Breaking changes] Bump several major dependencies #2041

Conversation

emmenko commented Feb 4, 2021 • edited Loading

vercel bot commented Feb 4, 2021 • edited Loading

changeset-bot bot commented Feb 4, 2021 • edited Loading

🦋 Changeset detected

emmenko commented Feb 5, 2021

emmenko commented Mar 16, 2021

emmenko commented Mar 31, 2021

tdeekens left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

adnasa left a comment • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

This comment was marked as outdated.

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

adnasa left a comment

Choose a reason for hiding this comment

emmenko commented Feb 4, 2021 •

edited

Loading

vercel bot commented Feb 4, 2021 •

edited

Loading

changeset-bot bot commented Feb 4, 2021 •

edited

Loading

adnasa left a comment •

edited

Loading