Bump NodeJS supported versions to ^16.16 || ^18.13 and add engines to package.json

.eslintrc.js

@@ -116,12 +116,6 @@ module.exports = {
         'import/extensions': 'off',
         'import/no-default-export': 'off',
         'import/no-anonymous-default-export': 'off',
-        // We could omit this if we set `engines` fields properly
-        // As we don't set them then eslint thinks we're using node 8
-        'node/no-unsupported-features/node-builtins': [
-          'error',
-          {version: '>=16.0.0'},
-        ],
       },
     },
     {

.github/CONTRIBUTING.md

@@ -137,7 +137,7 @@ Each contributor is required to [sign a CLA](https://cla.shopify.com/). This pro
 
 ### Contribution prerequisites
 
-- You have Node installed at v16.13.0+ and Yarn at v1.22.18+
+- You have Node installed at v18.13.0+ and Yarn at v1.22.18+
 
 ### Best practices
 

.github/workflows/changelog.yml

@@ -21,10 +21,10 @@ jobs:
         with:
           fetch-depth: 0
 
-      - name: Setup Node with v16.13.0
+      - name: Setup Node with v18.13.0
         uses: actions/setup-node@v3
         with:
-          node-version: 16.13.0
+          node-version: 18.13.0
 
       - name: Check for Changeset
         run: npx @changesets/cli status --since="origin/main"

.github/workflows/ci-a11y-vrt.yml

@@ -32,10 +32,10 @@ jobs:
           sudo rm -rf "/usr/local/share/boost"
           sudo rm -rf "$AGENT_TOOLSDIRECTORY"
 
-      - name: Setup Node with v16.13.0
+      - name: Setup Node with v18.13.0
         uses: actions/setup-node@v3
         with:
-          node-version: 16.13.0
+          node-version: 18.13.0
           cache: yarn
 
       - name: Restore cache
@@ -72,10 +72,10 @@ jobs:
         with:
           fetch-depth: 0 # Chromatic git history to track changes
 
-      - name: Setup Node with v16.13.0
+      - name: Setup Node with v18.13.0
         uses: actions/setup-node@v3
         with:
-          node-version: 16.13.0
+          node-version: 18.13.0
           cache: yarn
 
       - name: Restore cache

.github/workflows/ci.yml

@@ -13,7 +13,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: ['14.18.0', '16.13.0']
+        node-version: ['16.16.0', '18.13.0']
     steps:
       - name: Checkout branch
         uses: actions/checkout@v3

.nvmrc

@@ -1 +1 @@
-v16.13.0
+v18.13.0

dev.yml

@@ -2,7 +2,7 @@ name: polaris
 up:
   - node:
       yarn: v1.22.18
-      version: v16.13.0 # to be kept in sync with .nvmrc and .github/workflows/ci.yml
+      version: v18.13.0 # to be kept in sync with .nvmrc and .github/workflows/ci.yml
   - custom:
       name: Build monorepo
       met?: yarn build --output-logs=none

documentation/Nodejs support.md

@@ -16,38 +16,38 @@ The `package.json` engines. This should match the `.github/workflows/ci.yml` and
 
 ```json
 "engines": {
-  "node": "^14.18.0 || ^16.13.0"
+  "node": "^16.16.0 || ^18.13.0"
 },
 ```
 
 The GitHub actions `.github/workflows/ci.yml` file. This should match the `package.json` and list all supported versions.
 
 ```yml
-node-version: ['14.18.0', '16.13.0']
+node-version: ['16.16.0', '18.13.0']
 ```
 
 The `dev.yml` file which creates a local development environment. This should match the `.nvmrc` file.
 
 ```yml
-version: v16.13.0
+version: v18.13.0
 ```
 
 The `.nvmrc` file for local development. This should match the `dev.yml` file.
 
 ```
-v16.13.0
+v18.13.0
 ```
 
 The `shipit.yml` files. This should point towards the GitHub Actions the packages require to pass before publishing.
 
 ```yml
 ci:
   require:
-    - 'Validate with Node v14.18.0'
-    - 'Validate with Node v16.13.0'
+    - 'Validate with Node v16.16.0'
+    - 'Validate with Node v18.13.0'
 
 merge:
   require:
-    - 'Validate with Node v14.18.0'
-    - 'Validate with Node v16.13.0'
+    - 'Validate with Node v16.16.0'
+    - 'Validate with Node v18.13.0'
 ```

documentation/guides/migrating-from-v10-to-v11.md

@@ -4,11 +4,16 @@ Polaris v11.0.0 ([full release notes](https://github.com/Shopify/polaris/release
 
 ## Table of Contents
 
+- [Node support](#node-support)
 - [Components](#components)
   - [Removed deprecated Collapsible argument](#removed-deprecated-collapsible-argument)
   - [Removed KonamiCode component](#removed-konamicode-component)
 - [Tokens](#tokens)
 
+## Node support
+
+NodeJS version 14 is no longer supported. NodeJS 18 is recommended and 16 is supported.
+
 ## Components
 
 ### Removed deprecated Collapsible argument

package.json

@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "private": true,
   "engines": {
-    "node": "^14.18.0 || ^16.13.0"
+    "node": "^16.16.0 || ^18.13.0"
   },
   "workspaces": {
     "packages": [
@@ -44,28 +44,30 @@
     "postinstall": "patch-package"
   },
   "devDependencies": {
-    "@babel/core": "^7.15.0",
-    "@babel/node": "^7.14.9",
+    "@babel/core": "^7.20.12",
+    "@babel/node": "^7.20.7",
+    "@babel/preset-typescript": "^7.18.6",
     "@changesets/changelog-github": "^0.4.4",
     "@changesets/cli": "^2.23.0",
     "@changesets/get-release-plan": "^3.0.14",
     "@next/eslint-plugin-next": "^12.1.4",
-    "@rollup/plugin-babel": "^5.3.1",
-    "@rollup/plugin-commonjs": "^21.1.0",
-    "@rollup/plugin-image": "^2.0.5",
-    "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^13.2.1",
-    "@rollup/plugin-replace": "^2.3.3",
-    "@rollup/plugin-virtual": "^2.0.3",
-    "@rollup/pluginutils": "^4.1.0",
-    "@shopify/babel-preset": "^24.1.2",
+    "@rollup/plugin-babel": "^6.0.3",
+    "@rollup/plugin-commonjs": "^24.0.1",
+    "@rollup/plugin-image": "^3.0.2",
+    "@rollup/plugin-json": "^6.0.0",
+    "@rollup/plugin-node-resolve": "^15.0.1",
+    "@rollup/plugin-replace": "^5.0.2",
+    "@rollup/plugin-virtual": "^3.0.1",
+    "@rollup/pluginutils": "^5.0.2",
+    "@shopify/babel-preset": "^25.0.0",
     "@shopify/cli": "^3.10.1",
     "@shopify/eslint-plugin": "^42.0.1",
     "@shopify/prettier-config": "^1.1.2",
     "@shopify/stylelint-plugin": "^11.0.0",
     "@shopify/typescript-configs": "^5.1.0",
     "@size-limit/preset-small-lib": "^5.0.3",
     "@types/jest": "^27.5.1",
+    "babel-loader": "^9.1.2",
     "downlevel-dts": "^0.6.0",
     "eslint": "^8.3.0",
     "execa": "^5.0.0",
@@ -76,8 +78,8 @@
     "patch-package": "^6.4.7",
     "postinstall-postinstall": "^2.1.0",
     "prettier": "^2.5.0",
-    "rollup": "^2.70.2",
-    "rollup-plugin-node-externals": "^4.0.0",
+    "rollup": "^3.12.0",
+    "rollup-plugin-node-externals": "^5.1.0",
     "size-limit": "^5.0.3",
     "stylelint": "^14.15.0",
     "ts-node": "^10.7.0",

polaris-cli/package.json

@@ -31,7 +31,7 @@
   },
   "engine-strict": true,
   "engines": {
-    "node": ">=14.13.1"
+    "node": "^16.16.0 || ^18.13.0"
   },
   "os": [
     "darwin",

polaris-for-vscode/package.json

@@ -20,7 +20,7 @@
     "shopify"
   ],
   "engines": {
-    "vscode": "^1.64.0"
+    "node": "^16.16.0 || ^18.13.0"
   },
   "categories": [
     "Other"

polaris-icons/package.json

@@ -13,6 +13,9 @@
       ]
     }
   },
+  "engines": {
+    "node": "^16.16.0 || ^18.13.0"
+  },
   "scripts": {
     "build": "rollup -c",
     "dev": "rollup -c -w",

polaris-icons/rollup.config.mjs

@@ -222,24 +222,26 @@ export default [
         interop,
         entryFileNames: '[name].js',
         chunkFileNames: '[name].js',
+        manualChunks: (id) => {
+          if (id.startsWith(iconBasePath)) {
+            return id.replace(iconBasePath, 'icons/');
+          }
+        },
       },
       {
         dir: 'dist',
         format: 'esm',
         interop,
         entryFileNames: '[name].mjs',
         chunkFileNames: '[name].mjs',
+        manualChunks: (id) => {
+          if (id.startsWith(iconBasePath)) {
+            return id.replace(iconBasePath, 'icons/');
+          }
+        },
       },
     ],
-    manualChunks: (id) => {
-      // Generate distinct chunks for each icon
-      // This allows consuming apps to split up the icons into multiple subchunks
-      // containing a few icons each instead of always having to put every icon
-      // into a single shared chunk
-      if (id.startsWith(iconBasePath)) {
-        return id.replace(iconBasePath, 'icons/');
-      }
-    },
+
     external: ['react'],
     onwarn: (warning, warn) => {
       // Unresolved imports means Rollup couldn't find an import, possibly because

polaris-migrator/package.json

@@ -6,6 +6,9 @@
   "author": "Shopify <[email protected]>",
   "homepage": "https://polaris.shopify.com",
   "repository": "https://github.com/Shopify/polaris",
+  "engines": {
+    "node": "^16.16.0 || ^18.13.0"
+  },
   "bugs": {
     "url": "https://github.com/Shopify/polaris/issues"
   },
@@ -48,10 +51,6 @@
   "devDependencies": {
     "@types/is-git-clean": "^1.1.0",
     "@types/jscodeshift": "^0.11.5",
-    "@rollup/plugin-babel": "^5.3.1",
-    "@rollup/plugin-commonjs": "^22.0.2",
-    "@rollup/plugin-json": "^4.1.0",
-    "@rollup/plugin-node-resolve": "^13.3.0",
     "@shopify/polaris": "^10.24.0",
     "plop": "^3.1.1",
     "plop-dir": "^0.0.5",

polaris-migrator/rollup.config.mjs

@@ -21,14 +21,14 @@ export default {
   output: [
     {
       format: /** @type {const} */ ('cjs'),
-      entryFileNames: '[name][assetExtname].js',
+      entryFileNames: '[name].js',
       dir: path.dirname(pkg.main),
       preserveModules: true,
       exports: 'auto',
     },
     {
       format: /** @type {const} */ ('esm'),
-      entryFileNames: '[name][assetExtname].mjs',
+      entryFileNames: '[name].mjs',
       dir: path.dirname(pkg.module),
       preserveModules: true,
     },
@@ -45,7 +45,7 @@ export default {
       include: ['src/**/*'],
       babelHelpers: 'bundled',
       envName: 'production',
-      targets: 'node 14.13',
+      targets: 'node 16.16',
     }),
     json({compact: true}),
   ],

polaris-react/package.json

@@ -10,6 +10,9 @@
   "bugs": {
     "url": "https://github.com/Shopify/polaris/issues"
   },
+  "engines": {
+    "node": "^16.16.0 || ^18.13.0"
+  },
   "publishConfig": {
     "access": "public",
     "@shopify:registry": "https://registry.npmjs.org"
@@ -75,8 +78,6 @@
     "react-dom": "^16.14.0 || ^17.0.0 || ^18.0.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.15.0",
-    "@babel/node": "^7.14.9",
     "@changesets/get-release-plan": "^3.0.13",
     "@shopify/browserslist-config": "^3.0.0",
     "@shopify/jest-dom-mocks": "^3.0.5",
@@ -93,8 +94,6 @@
     "@types/react": "^18.0.15",
     "@types/react-dom": "^18.0.6",
     "ajv-cli": "^5.0.0",
-    "babel-core": "7.0.0-bridge.0",
-    "babel-loader": "^8.1.0",
     "change-case": "^3.1.0",
     "chromatic": "^6.5.4",
     "core-js": "^3.6.5",

polaris-react/playground/DetailsPage.tsx

@@ -527,8 +527,7 @@ export function DetailsPage() {
             alt={file.name}
             source={
               validImageTypes.indexOf(file.type) > 0
-                ? // eslint-disable-next-line node/no-unsupported-features/node-builtins
-                  URL.createObjectURL(file)
+                ? URL.createObjectURL(file)
                 : 'https://cdn.shopify.com/s/files/1/0757/9955/files/New_Post.png?12678548500147524304'
             }
           />

polaris-react/rollup.config.mjs

@@ -54,7 +54,7 @@ function generateConfig({output, targets, stylesConfig}) {
 /** @type {import('rollup').RollupOptions} */
 export default [
   generateConfig({
-    targets: 'extends @shopify/browserslist-config, node 12.20',
+    targets: 'extends @shopify/browserslist-config, node 16.16',
     stylesConfig: {
       mode: 'standalone',
       output: 'styles.css',
@@ -69,14 +69,14 @@ export default [
         format: 'cjs',
         dir: path.dirname(pkg.main),
         preserveModules: true,
-        entryFileNames: '[name][assetExtname].js',
+        entryFileNames: '[name].js',
         exports: 'named',
       },
       {
         format: 'esm',
         dir: path.dirname(pkg.module),
         preserveModules: true,
-        entryFileNames: '[name][assetExtname].js',
+        entryFileNames: '[name].js',
       },
     ],
   }),
@@ -95,7 +95,7 @@ export default [
         format: 'esm',
         dir: path.dirname(pkg.esnext),
         preserveModules: true,
-        entryFileNames: '[name][assetExtname].esnext',
+        entryFileNames: '[name].esnext',
       },
     ],
   }),

polaris-react/scripts/build-validate.js

@@ -1,4 +1,3 @@
-// eslint-disable-next-line node/no-unsupported-features/node-builtins
 const assert = require('assert').strict;
 const fs = require('fs');