chore(rollup): upgrade rollup deps, migrate to mjs config file, enfor…

…ce linting on mjs files (#5830)

Co-authored-by: Danny Banks <[email protected]>

.changeset/good-bats-teach.md

@@ -0,0 +1,16 @@
+---
+"@aws-amplify/ui-angular": patch
+"@aws-amplify/ui-react": patch
+"@aws-amplify/ui-react-ai": patch
+"@aws-amplify/ui-react-core": patch
+"@aws-amplify/ui-react-core-notifications": patch
+"@aws-amplify/ui-react-geo": patch
+"@aws-amplify/ui-react-liveness": patch
+"@aws-amplify/ui-react-native": patch
+"@aws-amplify/ui-react-notifications": patch
+"@aws-amplify/ui-react-storage": patch
+"@aws-amplify/ui": patch
+"@aws-amplify/ui-vue": patch
+---
+
+chore(rollup): upgrade rollup deps, migrate to mjs config file, enforce linting on mjs files

package.json

@@ -97,6 +97,7 @@
     "react-dom": "18.2.0",
     "react-native": "0.71.16",
     "react-devtools-core": "^4.28.4",
+    "rollup": "^4.22.4",
     "send": "^0.19.0",
     "shell-quote": "1.7.3",
     "socks": "^2.7.3",
@@ -112,7 +113,8 @@
     "@aws-amplify/typescript-config": "0.0.0",
     "@changesets/changelog-github": "0.4.1",
     "@changesets/cli": "^2.26.2",
-    "@rollup/plugin-typescript": "^11.1.4",
+    "@rollup/plugin-commonjs": "^28.0.0",
+    "@rollup/plugin-typescript": "^12.1.0",
     "@size-limit/preset-big-lib": "^11.1.5",
     "@testing-library/jest-dom": "^6.1.5",
     "@testing-library/react": "^14.0.0",
@@ -133,8 +135,8 @@
     "prettier": "^3.0.3",
     "react-test-renderer": "^18.2.0",
     "rimraf": "^3.0.2",
-    "rollup": "^2.70.0",
-    "rollup-plugin-node-externals": "^4.1.1",
+    "rollup": "^4.22.4",
+    "rollup-plugin-node-externals": "^7.1.3",
     "rollup-plugin-styles": "^4.0.0",
     "ts-jest": "^29.1.1",
     "ts-morph": "^17.0.0",

packages/react-ai/.eslintrc.js

@@ -1,12 +1,13 @@
 module.exports = {
-  extends: ['@aws-amplify/amplify-ui/react'],
-  ignorePatterns: ['.eslintrc.js', 'dist', 'rollup.config.ts'],
+  extends: '@aws-amplify/amplify-ui/react',
+  ignorePatterns: ['.eslintrc.js', 'coverage', 'dist', 'node_modules'],
   // point to local tsconfig
   parserOptions: { project: ['tsconfig.json'], tsconfigRootDir: __dirname },
   overrides: [
     {
       extends: ['@aws-amplify/amplify-ui/jest'],
       files: ['**/__mocks__/**', '**/__tests__/**'],
     },
+    { files: '*.mjs' },
   ],
 };

packages/react-ai/.lintstagedrc.js

@@ -2,5 +2,5 @@ const config = require('../../.lintstagedrc.js');
 
 module.exports = {
   ...config,
-  '*.{ts,tsx,js}': 'eslint',
+  '*.{ts,tsx,js,mjs}': 'eslint',
 };

packages/react-ai/package.json

@@ -34,7 +34,7 @@
     "check:esm": "node --input-type=module --eval 'import \"@aws-amplify/ui-react-ai\"'",
     "clean": "rimraf dist node_modules",
     "dev": "yarn build:rollup --watch",
-    "lint": "yarn typecheck && eslint src",
+    "lint": "yarn typecheck && eslint .",
     "prebuild": "rimraf dist",
     "size": "yarn size-limit",
     "test": "jest",
@@ -53,7 +53,6 @@
     "@aws-amplify/ui-react-core": "^3.0.25"
   },
   "devDependencies": {
-    "@rollup/plugin-commonjs": "^22.0.1",
     "@types/jest-when": "^3.5.0",
     "jest-when": "^3.5.1"
   }

packages/react-ai/rollup.config.ts → packages/react-ai/rollup.config.mjs

@@ -8,14 +8,22 @@ const input = ['src/index.ts'];
 const sourceMap = false;
 const tsconfig = 'tsconfig.dist.json';
 
+/**
+ * @type {import('rollup').OutputOptions}
+ */
+const cjsOutput = {
+  dir: 'dist',
+  esModule: true,
+  format: 'cjs',
+  generatedCode: { reservedNamesAsProps: false },
+  interop: 'auto',
+};
+
 const config = defineConfig([
   // CJS config
   {
     input,
-    output: {
-      dir: 'dist',
-      format: 'cjs',
-    },
+    output: cjsOutput,
     plugins: [
       externals({ include: /^@aws-amplify/ }),
       typescript({ declarationDir: 'dist/types', sourceMap, tsconfig }),

packages/react-ai/tsconfig.json

@@ -1,5 +1,5 @@
 {
   "extends": "@aws-amplify/typescript-config/tsconfig.react.json",
-  "include": ["jest.*.ts", "src/**/*.ts", "src/**/*.tsx"],
+  "include": ["*.ts", "*.mjs", "src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["node_modules"]
 }

packages/react-auth/.eslintrc.js

@@ -1,12 +1,13 @@
 module.exports = {
-  extends: ['@aws-amplify/amplify-ui/react'],
-  ignorePatterns: ['.eslintrc.js', 'dist', 'rollup.config.ts'],
+  extends: '@aws-amplify/amplify-ui/react',
+  ignorePatterns: ['.eslintrc.js', 'coverage', 'dist', 'node_modules'],
   // point to local tsconfig
   parserOptions: { project: ['tsconfig.json'], tsconfigRootDir: __dirname },
   overrides: [
     {
       extends: ['@aws-amplify/amplify-ui/jest'],
       files: ['**/__mocks__/**', '**/__tests__/**'],
     },
+    { files: '*.mjs' },
   ],
 };

packages/react-auth/.lintstagedrc.js

@@ -2,5 +2,5 @@ const config = require('../../.lintstagedrc.js');
 
 module.exports = {
   ...config,
-  '*.{ts,tsx,js}': 'eslint',
+  '*.{ts,tsx,js,mjs}': 'eslint',
 };

packages/react-auth/package.json

@@ -32,7 +32,7 @@
     "check:esm": "node --input-type=module --eval 'import \"@aws-amplify/ui-react-auth\"'",
     "clean": "rimraf dist node_modules",
     "dev": "yarn build:rollup --watch",
-    "lint": "yarn typecheck && eslint src --ext .js,.ts,.tsx",
+    "lint": "yarn typecheck && eslint .",
     "prebuild": "rimraf dist",
     "size": "yarn size-limit",
     "test": "jest",

packages/react-notifications/rollup.config.ts → packages/react-auth/rollup.config.mjs

@@ -8,14 +8,22 @@ const input = ['src/index.ts'];
 const sourceMap = false;
 const tsconfig = 'tsconfig.dist.json';
 
+/**
+ * @type {import('rollup').OutputOptions}
+ */
+const cjsOutput = {
+  dir: 'dist',
+  esModule: true,
+  format: 'cjs',
+  generatedCode: { reservedNamesAsProps: false },
+  interop: 'auto',
+};
+
 const config = defineConfig([
   // CJS config
   {
     input,
-    output: {
-      dir: 'dist',
-      format: 'cjs',
-    },
+    output: cjsOutput,
     plugins: [
       externals({ include: /^@aws-amplify/ }),
       typescript({ declarationDir: 'dist/types', sourceMap, tsconfig }),

packages/react-auth/tsconfig.json

@@ -1,5 +1,5 @@
 {
   "extends": "@aws-amplify/typescript-config/tsconfig.react.json",
-  "include": ["jest.config.ts", "src/**/*.ts", "src/**/*.tsx"],
+  "include": ["*.ts", "*.mjs", "src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["node_modules"]
 }

packages/react-core-auth/.eslintrc.js

@@ -1,12 +1,13 @@
 module.exports = {
-  extends: ['@aws-amplify/amplify-ui/react'],
-  ignorePatterns: ['.eslintrc.js', 'dist'],
+  extends: '@aws-amplify/amplify-ui/react',
+  ignorePatterns: ['.eslintrc.js', 'coverage', 'dist', 'node_modules'],
   // point to local tsconfig
   parserOptions: { project: ['tsconfig.json'], tsconfigRootDir: __dirname },
   overrides: [
     {
       extends: ['@aws-amplify/amplify-ui/jest'],
       files: ['**/__mocks__/**', '**/__tests__/**'],
     },
+    { files: '*.mjs' },
   ],
 };

packages/react-core-auth/.lintstagedrc.js

@@ -2,5 +2,5 @@ const config = require('../../.lintstagedrc.js');
 
 module.exports = {
   ...config,
-  '*.{ts,tsx,js}': 'eslint',
+  '*.{ts,tsx,js,mjs}': 'eslint',
 };

packages/react-core-auth/package.json

@@ -26,7 +26,7 @@
     "clean": "rimraf dist node_modules",
     "check:esm": "node --input-type=module --eval 'import \"@aws-amplify/ui-react-core-auth\"'",
     "dev": "yarn build --watch",
-    "lint": "yarn typecheck && eslint src",
+    "lint": "yarn typecheck && eslint .",
     "prebuild": "rimraf dist",
     "test": "jest",
     "test:watch": "yarn test --watch",

packages/react-core-auth/rollup.config.ts → packages/react-core-auth/rollup.config.mjs

@@ -9,11 +9,22 @@ const tsconfig = 'tsconfig.dist.json';
 
 const esmOutputDir = 'dist/esm';
 
+/**
+ * @type {import('rollup').OutputOptions}
+ */
+const cjsOutput = {
+  dir: 'dist',
+  esModule: true,
+  format: 'cjs',
+  generatedCode: { reservedNamesAsProps: false },
+  interop: 'auto',
+};
+
 const config = defineConfig([
   // CJS config
   {
     input,
-    output: { dir: 'dist', format: 'cjs' },
+    output: cjsOutput,
     plugins: [
       externals({ include: /^@aws-amplify/ }),
       typescript({ declarationDir: 'dist/types', sourceMap, tsconfig }),

packages/react-core-auth/tsconfig.json

@@ -1,5 +1,5 @@
 {
   "extends": "@aws-amplify/typescript-config/tsconfig.react.json",
-  "include": ["*.config.ts", "src/**/*.ts", "src/**/*.tsx"],
+  "include": ["*.mjs", "*.ts", "src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["node_modules"]
 }

packages/react-core-notifications/.eslintrc.js

@@ -1,12 +1,13 @@
 module.exports = {
-  extends: ['@aws-amplify/amplify-ui/react'],
-  ignorePatterns: ['.eslintrc.js', 'dist'],
+  extends: '@aws-amplify/amplify-ui/react',
+  ignorePatterns: ['.eslintrc.js', 'coverage', 'dist', 'node_modules'],
   // point to local tsconfig
   parserOptions: { project: ['tsconfig.json'], tsconfigRootDir: __dirname },
   overrides: [
     {
       extends: ['@aws-amplify/amplify-ui/jest'],
       files: ['**/__mocks__/**', '**/__tests__/**'],
     },
+    { files: '*.mjs' },
   ],
 };

packages/react-core-notifications/.lintstagedrc.js

@@ -2,5 +2,5 @@ const config = require('../../.lintstagedrc.js');
 
 module.exports = {
   ...config,
-  '*.{ts,tsx,js}': 'eslint',
+  '*.{ts,tsx,js,mjs}': 'eslint',
 };

packages/react-core-notifications/package.json

@@ -28,7 +28,7 @@
     "check:esm": "node --input-type=module --eval 'import \"@aws-amplify/ui-react-core-notifications\"'",
     "clean": "rimraf dist node_modules",
     "dev": "yarn build:rollup --watch",
-    "lint": "yarn typecheck && eslint src --ext .js,.ts,.tsx",
+    "lint": "yarn typecheck && eslint .",
     "prebuild": "rimraf dist",
     "test": "jest",
     "test:watch": "yarn test --watch",

packages/react-core-notifications/rollup.config.ts → packages/react-core-notifications/rollup.config.mjs

@@ -7,14 +7,22 @@ const input = ['src/index.ts'];
 const sourceMap = false;
 const tsconfig = 'tsconfig.dist.json';
 
+/**
+ * @type {import('rollup').OutputOptions}
+ */
+const cjsOutput = {
+  dir: 'dist',
+  esModule: true,
+  format: 'cjs',
+  generatedCode: { reservedNamesAsProps: false },
+  interop: 'auto',
+};
+
 const config = defineConfig([
   // CJS config
   {
     input,
-    output: {
-      dir: 'dist',
-      format: 'cjs',
-    },
+    output: cjsOutput,
     plugins: [
       externals({ include: /^@aws-amplify/ }),
       typescript({ declarationDir: 'dist/types', sourceMap, tsconfig }),

packages/react-core-notifications/tsconfig.json

@@ -1,5 +1,5 @@
 {
   "extends": "@aws-amplify/typescript-config/tsconfig.react.json",
-  "include": ["*.config.ts", "src/**/*.ts", "src/**/*.tsx"],
+  "include": ["*.mjs", "*.ts", "src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["node_modules"]
 }

packages/react-core/.eslintrc.js

@@ -1,12 +1,13 @@
 module.exports = {
   extends: '@aws-amplify/amplify-ui/react',
-  ignorePatterns: ['.eslintrc.js', 'dist'],
+  ignorePatterns: ['.eslintrc.js', 'coverage', 'dist', 'node_modules'],
   // point to local tsconfig
   parserOptions: { project: ['tsconfig.json'], tsconfigRootDir: __dirname },
   overrides: [
     {
       extends: '@aws-amplify/amplify-ui/jest',
       files: ['**/__mocks__/**', '**/__tests__/**'],
     },
+    { files: '*.mjs' },
   ],
 };

packages/react-core/.lintstagedrc.js

@@ -2,5 +2,5 @@ const config = require('../../.lintstagedrc.js');
 
 module.exports = {
   ...config,
-  '*.{ts,tsx,js}': 'eslint',
+  '*.{ts,tsx,js,mjs}': 'eslint',
 };

packages/react-core/elements/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aws-amplify/ui-react-core/elements",
   "main": "../dist/elements.js",
-  "module": "../dist/esm/elements/elements.mjs",
+  "module": "../dist/esm/elements.mjs",
   "types": "../dist/types/elements/index.d.ts"
 }

packages/react-core/package.json

@@ -11,7 +11,7 @@
       "types": "./dist/types/index.d.ts"
     },
     "./elements": {
-      "import": "./dist/esm/elements/elements.mjs",
+      "import": "./dist/esm/elements.mjs",
       "require": "./dist/elements.js",
       "react-native": "./src/elements/index.ts",
       "types": "./dist/types/elements/index.d.ts"
@@ -33,7 +33,7 @@
     "build": "rollup --config",
     "check:esm": "node --input-type=module --eval 'import \"@aws-amplify/ui-react-core\"'",
     "dev": "yarn build --watch",
-    "lint": "yarn typecheck && eslint src",
+    "lint": "yarn typecheck && eslint .",
     "prebuild": "rimraf dist",
     "test": "jest",
     "test:watch": "yarn test --watch",

packages/react-core/rollup.config.ts → packages/react-core/rollup.config.mjs

@@ -11,11 +11,22 @@ const tsconfig = 'tsconfig.dist.json';
 
 const esmOutputDir = 'dist/esm';
 
+/**
+ * @type {import('rollup').OutputOptions}
+ */
+const cjsOutput = {
+  dir: 'dist',
+  esModule: true,
+  format: 'cjs',
+  generatedCode: { reservedNamesAsProps: false },
+  interop: 'auto',
+};
+
 const config = defineConfig([
   // CJS config
   {
     input,
-    output: { dir: 'dist', format: 'cjs' },
+    output: cjsOutput,
     plugins: [
       externals({ include: /^@aws-amplify/ }),
       typescript({ declarationDir: 'dist/types', sourceMap, tsconfig }),

packages/react-core/tsconfig.json

@@ -1,5 +1,5 @@
 {
   "extends": "@aws-amplify/typescript-config/tsconfig.react.json",
-  "include": ["*.config.ts", "src/**/*.ts", "src/**/*.tsx"],
+  "include": ["*.mjs", "*.ts", "src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["node_modules"]
 }