Replace custom build scripts w/ Preconstruct (#732)

Author: Chance Strickland

babel.config.js

@@ -0,0 +1,19 @@
+module.exports = {
+  plugins: [
+    "babel-plugin-annotate-pure-calls",
+    "babel-plugin-dev-expression",
+    ["@babel/plugin-proposal-class-properties", { loose: true }],
+    "babel-plugin-macros",
+  ],
+  presets: [
+    "@babel/preset-typescript",
+    "@babel/preset-react",
+    [
+      "@babel/preset-env",
+      {
+        modules: false,
+        loose: true,
+      },
+    ],
+  ],
+};

package.json

@@ -10,26 +10,29 @@
   },
   "scripts": {
     "start": "start-storybook -p 9001 -c .storybook",
-    "dev": "yarn start",
     "test": "cross-env CI=true ts-node ./scripts/test packages",
     "test:pkg": "cross-env CI=true ts-node ./scripts/test --pkg",
     "test:watch": "ts-node ./scripts/test packages",
     "test:coverage": "yarn test --coverage",
-    "build": "node -r ts-node/register --max-old-space-size=3049 scripts/build-all",
-    "build:pkg": "ts-node --transpile-only scripts/build-package",
+    "build": "yarn build:packages",
+    "build:packages": "preconstruct build",
     "ver": "lerna version --no-push --exact",
     "changes": "dotenv lerna-changelog",
     "clean": "git clean -e '!/.env' -e '!/website-deploy-key' -e '!/website-deploy-key.pub' -fdX .",
     "lint": "eslint .",
+    "fix": "manypkg fix && preconstruct fix",
+    "dev": "yarn start",
+    "postinstall": "manypkg check && preconstruct dev",
     "release": "lerna publish from-git --yes --pre-dist-tag next"
   },
   "dependencies": {
-    "@babel/core": "^7.11.4",
-    "@babel/plugin-proposal-class-properties": "^7.10.4",
-    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.10.4",
-    "@babel/plugin-proposal-optional-chaining": "^7.11.0",
-    "@babel/preset-env": "^7.11.0",
-    "@babel/preset-react": "^7.10.4",
+    "@babel/core": "^7.12.10",
+    "@babel/plugin-proposal-class-properties": "^7.12.1",
+    "@babel/preset-env": "^7.12.11",
+    "@babel/preset-react": "^7.12.10",
+    "@babel/preset-typescript": "^7.12.7",
+    "@manypkg/cli": "^0.17.0",
+    "@preconstruct/cli": "^2.0.1",
     "@reach/router": "^1.3.4",
     "@rollup/plugin-commonjs": "^15.0.0",
     "@rollup/plugin-json": "^4.1.0",
@@ -66,13 +69,12 @@
     "@typescript-eslint/eslint-plugin": "^3.9.1",
     "@typescript-eslint/parser": "^3.9.1",
     "autoprefixer": "^9.8.6",
-    "awesome-typescript-loader": "^5.2.1",
     "babel-eslint": "^10.1.0",
-    "babel-jest": "^26.3.0",
-    "babel-loader": "^8.1.0",
+    "babel-jest": "^26.6.3",
+    "babel-loader": "^8.2.2",
     "babel-plugin-annotate-pure-calls": "0.4.0",
     "babel-plugin-dev-expression": "0.2.2",
-    "babel-plugin-macros": "^2.8.0",
+    "babel-plugin-macros": "^3.0.1",
     "chalk": "^4.1.0",
     "cross-env": "^7.0.2",
     "dotenv-cli": "^3.2.0",
@@ -86,8 +88,8 @@
     "fs-extra": "^9.0.1",
     "husky": "^4.2.5",
     "jest": "^26.4.1",
-    "jest-watch-typeahead": "0.6.0",
     "jest-axe": "^3.5.0",
+    "jest-watch-typeahead": "0.6.0",
     "lerna": "^3.22.1",
     "lerna-changelog": "^1.0.1",
     "lerna-script": "^1.3.2",
@@ -105,11 +107,6 @@
     "react-router-dom": "^5.2.0",
     "react-spring": "^8.0.27",
     "react-test-renderer": "^16.13.1",
-    "rollup": "^2.26.4",
-    "rollup-plugin-babel": "^4.4.0",
-    "rollup-plugin-sourcemaps": "0.6.2",
-    "rollup-plugin-terser": "^7.0.0",
-    "rollup-plugin-typescript2": "0.27.2",
     "sinon": "^9.0.3",
     "styled-components": "^5.1.1",
     "ts-jest": "^26.3.0",
@@ -182,5 +179,10 @@
   ],
   "prettier": {
     "singleQuote": false
+  },
+  "preconstruct": {
+    "packages": [
+      "packages/*"
+    ]
   }
 }

packages/accordion/package.json

@@ -9,25 +9,31 @@
     "url": "git+https://github.com/reach/reach-ui.git",
     "directory": "packages/accordion"
   },
-  "scripts": {
-    "build": "ts-node --transpile-only ../../scripts/build-package $npm_package_name"
-  },
   "dependencies": {
     "@reach/auto-id": "0.13.0",
     "@reach/descendants": "0.13.0",
     "@reach/utils": "0.13.0",
+    "prop-types": "^15.7.2",
     "tslib": "^2.0.0"
   },
+  "devDependencies": {
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1"
+  },
   "peerDependencies": {
     "react": "^16.8.0 || 17.x",
     "react-dom": "^16.8.0 || 17.x"
   },
-  "main": "dist/index.js",
-  "module": "dist/accordion.esm.js",
-  "typings": "dist/index.d.ts",
+  "main": "dist/reach-accordion.cjs.js",
+  "module": "dist/reach-accordion.esm.js",
+  "types": "dist/reach-accordion.cjs.d.ts",
   "files": [
     "README.md",
     "dist",
     "styles.css"
+  ],
+  "eslintIgnore": [
+    "node_modules",
+    "dist"
   ]
 }

packages/alert-dialog/package.json

@@ -9,9 +9,6 @@
     "url": "git+https://github.com/reach/reach-ui.git",
     "directory": "packages/alert-dialog"
   },
-  "scripts": {
-    "build": "ts-node --transpile-only ../../scripts/build-package $npm_package_name"
-  },
   "dependencies": {
     "@reach/auto-id": "0.13.0",
     "@reach/dialog": "0.13.0",
@@ -20,15 +17,23 @@
     "prop-types": "^15.7.2",
     "tslib": "^2.0.0"
   },
+  "devDependencies": {
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1"
+  },
   "peerDependencies": {
     "react": "^16.8.0 || 17.x",
     "react-dom": "^16.8.0 || 17.x"
   },
-  "main": "dist/index.js",
-  "module": "dist/alert-dialog.esm.js",
-  "typings": "dist/index.d.ts",
+  "main": "dist/reach-alert-dialog.cjs.js",
+  "module": "dist/reach-alert-dialog.esm.js",
+  "types": "dist/reach-alert-dialog.cjs.d.ts",
   "files": [
     "README.md",
     "dist"
+  ],
+  "eslintIgnore": [
+    "node_modules",
+    "dist"
   ]
 }

packages/alert/package.json

@@ -9,24 +9,29 @@
     "url": "git+https://github.com/reach/reach-ui.git",
     "directory": "packages/alert"
   },
-  "scripts": {
-    "build": "ts-node --transpile-only ../../scripts/build-package $npm_package_name"
-  },
   "dependencies": {
     "@reach/utils": "0.13.0",
     "@reach/visually-hidden": "0.13.0",
     "prop-types": "^15.7.2",
     "tslib": "^2.0.0"
   },
+  "devDependencies": {
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1"
+  },
   "peerDependencies": {
     "react": "^16.8.0 || 17.x",
     "react-dom": "^16.8.0 || 17.x"
   },
-  "main": "dist/index.js",
-  "module": "dist/alert.esm.js",
-  "typings": "dist/index.d.ts",
+  "main": "dist/reach-alert.cjs.js",
+  "module": "dist/reach-alert.esm.js",
+  "types": "dist/reach-alert.cjs.d.ts",
   "files": [
     "README.md",
     "dist"
+  ],
+  "eslintIgnore": [
+    "node_modules",
+    "dist"
   ]
 }

packages/auto-id/package.json

@@ -9,22 +9,27 @@
     "url": "git+https://github.com/reach/reach-ui.git",
     "directory": "packages/auto-id"
   },
-  "scripts": {
-    "build": "ts-node --transpile-only ../../scripts/build-package $npm_package_name"
+  "dependencies": {
+    "@reach/utils": "0.13.0",
+    "tslib": "^2.0.0"
+  },
+  "devDependencies": {
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1"
   },
   "peerDependencies": {
     "react": "^16.8.0 || 17.x",
     "react-dom": "^16.8.0 || 17.x"
   },
-  "main": "dist/index.js",
-  "module": "dist/auto-id.esm.js",
-  "typings": "dist/index.d.ts",
+  "main": "dist/reach-auto-id.cjs.js",
+  "module": "dist/reach-auto-id.esm.js",
+  "types": "dist/reach-auto-id.cjs.d.ts",
   "files": [
     "README.md",
     "dist"
   ],
-  "dependencies": {
-    "@reach/utils": "0.13.0",
-    "tslib": "^2.0.0"
-  }
+  "eslintIgnore": [
+    "node_modules",
+    "dist"
+  ]
 }

packages/checkbox/package.json

@@ -10,25 +10,31 @@
     "url": "git+https://github.com/reach/reach-ui.git",
     "directory": "packages/checkbox"
   },
-  "scripts": {
-    "build": "ts-node --transpile-only ../../scripts/build-package $npm_package_name"
-  },
   "dependencies": {
     "@reach/auto-id": "0.13.0",
     "@reach/machine": "0.13.0",
     "@reach/utils": "0.13.0",
+    "prop-types": "^15.7.2",
     "tslib": "^2.0.0"
   },
+  "devDependencies": {
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1"
+  },
   "peerDependencies": {
     "react": "^16.8.0 || 17.x",
     "react-dom": "^16.8.0 || 17.x"
   },
-  "main": "dist/index.js",
-  "module": "dist/checkbox.esm.js",
-  "typings": "dist/index.d.ts",
+  "main": "dist/reach-checkbox.cjs.js",
+  "module": "dist/reach-checkbox.esm.js",
+  "types": "dist/reach-checkbox.cjs.d.ts",
   "files": [
     "README.md",
     "dist",
     "styles.css"
+  ],
+  "eslintIgnore": [
+    "node_modules",
+    "dist"
   ]
 }

packages/combobox/package.json

@@ -9,9 +9,6 @@
     "url": "git+https://github.com/reach/reach-ui.git",
     "directory": "packages/combobox"
   },
-  "scripts": {
-    "build": "ts-node --transpile-only ../../scripts/build-package $npm_package_name"
-  },
   "dependencies": {
     "@reach/auto-id": "0.13.0",
     "@reach/descendants": "0.13.0",
@@ -22,16 +19,24 @@
     "prop-types": "^15.7.2",
     "tslib": "^2.0.0"
   },
+  "devDependencies": {
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1"
+  },
   "peerDependencies": {
     "react": "^16.8.0 || 17.x",
     "react-dom": "^16.8.0 || 17.x"
   },
-  "main": "dist/index.js",
-  "module": "dist/combobox.esm.js",
-  "typings": "dist/index.d.ts",
+  "main": "dist/reach-combobox.cjs.js",
+  "module": "dist/reach-combobox.esm.js",
+  "types": "dist/reach-combobox.cjs.d.ts",
   "files": [
     "README.md",
     "dist",
     "styles.css"
+  ],
+  "eslintIgnore": [
+    "node_modules",
+    "dist"
   ]
 }

packages/component-component/package.json

@@ -9,20 +9,25 @@
     "url": "git+https://github.com/reach/reach-ui.git",
     "directory": "packages/component-component"
   },
-  "scripts": {
-    "build": "ts-node --transpile-only ../../scripts/build-package $npm_package_name"
-  },
   "dependencies": {
     "prop-types": "^15.7.2"
   },
+  "devDependencies": {
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1"
+  },
   "peerDependencies": {
-    "react": "^16.4.0",
-    "react-dom": "^16.4.0"
+    "react": "^16.4.0 || 17.x",
+    "react-dom": "^16.4.0 || 17.x"
   },
-  "main": "dist/index.js",
-  "module": "dist/component-component.esm.js",
+  "main": "dist/reach-component-component.cjs.js",
+  "module": "dist/reach-component-component.esm.js",
   "files": [
     "README.md",
     "dist"
+  ],
+  "eslintIgnore": [
+    "node_modules",
+    "dist"
   ]
 }

packages/descendants/package.json

@@ -9,22 +9,27 @@
     "url": "git+https://github.com/reach/reach-ui.git",
     "directory": "packages/descendants"
   },
-  "scripts": {
-    "build": "ts-node --transpile-only ../../scripts/build-package $npm_package_name"
-  },
   "dependencies": {
     "@reach/utils": "0.13.0",
     "tslib": "^2.0.0"
   },
+  "devDependencies": {
+    "react": "^17.0.1",
+    "react-dom": "^17.0.1"
+  },
   "peerDependencies": {
     "react": "^16.8.0 || 17.x",
     "react-dom": "^16.8.0 || 17.x"
   },
-  "main": "dist/index.js",
-  "module": "dist/descendants.esm.js",
-  "typings": "dist/index.d.ts",
+  "main": "dist/reach-descendants.cjs.js",
+  "module": "dist/reach-descendants.esm.js",
+  "types": "dist/reach-descendants.cjs.d.ts",
   "files": [
     "README.md",
     "dist"
+  ],
+  "eslintIgnore": [
+    "node_modules",
+    "dist"
   ]
 }