Merge pull request #24 from etr2460/erik-ritter--preconstruct

Use preconstruct for building releases

CONTRIBUTING.md

@@ -14,10 +14,12 @@ cd web3-ui
 # web3-ui uses Node 16. We recommend using nvm to locally manage node versions.
 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.0/install.sh | bash
 nvm install
+# yarn install also runs `preconstruct dev`, which dynamically links all
+# packages in the monorepo together.
 yarn install
 ```
 
-To verify setup, run the Storybook by first running `yarn build` and then either `yarn storybook:components` or `yarn storybook:hooks`. You can develop new or existing components and verify functionality in the Storybook.
+To verify setup, run the Storybook for one of the packages with either `yarn storybook:components` or `yarn storybook:hooks`. You can develop new or existing components and verify functionality in the Storybook.
 
 Run all unit tests with `yarn test`. Run unit tests on only the package you're working on with `yarn test packages/<PACKAGE_NAME_HERE>`.
 

package.json

@@ -22,15 +22,27 @@
     "test:watch": "yarn test --watch",
     "test:coverage": "jest --coverage --colors",
     "storybook:components": "yarn workspace @web3-ui/components storybook",
-    "storybook:hooks": "yarn workspace @web3-ui/hooks storybook"
+    "storybook:hooks": "yarn workspace @web3-ui/hooks storybook",
+    "postinstall": "preconstruct dev"
   },
   "devDependencies": {
+    "@babel/cli": "^7.16.0",
+    "@babel/core": "^7.16.0",
+    "@babel/preset-env": "^7.16.4",
+    "@babel/preset-react": "^7.16.0",
+    "@babel/preset-typescript": "^7.16.0",
+    "@preconstruct/cli": "^2.1.5",
     "@testing-library/jest-dom": "^5.15.1",
     "@testing-library/react": "^12.1.2",
     "jest": "^26.6.3",
     "ts-jest": "^26.4.4"
   },
   "lint-staged": {
     "*.{ts,tsx,json,js,jsx}": "yarn format"
+  },
+  "preconstruct": {
+    "packages": [
+      "packages/*"
+    ]
   }
 }

packages/components/.babelrc

@@ -0,0 +1,7 @@
+{
+  "presets": [
+    "@babel/preset-env",
+    "@babel/preset-typescript",
+    "@babel/preset-react"
+  ]
+}

packages/components/package.json

@@ -18,15 +18,14 @@
     "url": "git+https://github.com/Developer-DAO/web3-ui/"
   },
   "scripts": {
-    "build": "yarn clean; rollup -c",
-    "clean": "rimraf dist",
+    "build": "preconstruct build",
     "format": "prettier --write \"src/**/*.{ts,tsx,json,js,jsx}\"",
     "format:check": "prettier --list-different \"src/**/*.{ts,tsx,json,js,jsx}\"",
     "storybook": "start-storybook -p 9001 -s ./src/assets -c .storybook",
     "pre-commit-hook": "yarn lint-staged"
   },
-  "main": "dist/index.js",
-  "module": "dist/index.esm.js",
+  "main": "dist/web3-ui-components.cjs.js",
+  "module": "dist/web3-ui-components.esm.js",
   "types": "dist/index.d.ts",
   "dependencies": {
     "@chakra-ui/react": "^1.7.2",
@@ -42,8 +41,6 @@
   },
   "devDependencies": {
     "@babel/core": "^7.12.7",
-    "@rollup/plugin-commonjs": "^16.0.0",
-    "@rollup/plugin-node-resolve": "^10.0.0",
     "@storybook/react": "^6.3.12",
     "@types/classnames": "^2.2.11",
     "@types/jest": "^26.0.15",
@@ -59,12 +56,6 @@
     "prettier": "^2.2.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "rimraf": "^3.0.2",
-    "rollup": "^2.33.3",
-    "rollup-plugin-copy": "^3.3.0",
-    "rollup-plugin-postcss": "^3.1.8",
-    "rollup-plugin-terser": "7.0.2",
-    "rollup-plugin-typescript2": "^0.29.0",
     "ts-loader": "^8.0.11",
     "typescript": "^4.1.0",
     "webpack": "^4.42.1"

packages/components/src/components/Address/Address.tsx

@@ -1,4 +1,4 @@
-import { Input } from '@chakra-ui/input';
+import { Input } from '@chakra-ui/react';
 import React from 'react';
 
 export interface AddressProps {

packages/hooks/.babelrc

@@ -0,0 +1,7 @@
+{
+  "presets": [
+    "@babel/preset-env",
+    "@babel/preset-typescript",
+    "@babel/preset-react"
+  ]
+}

packages/hooks/package.json

@@ -18,8 +18,7 @@
     "url": "git+https://github.com/Developer-DAO/web3-ui/"
   },
   "scripts": {
-    "build": "yarn clean; rollup -c",
-    "clean": "rimraf dist",
+    "build": "preconstruct build",
     "format": "prettier --write \"src/**/*.{ts,tsx,json,js,jsx}\"",
     "format:check": "prettier --list-different \"src/**/*.{ts,tsx,json,js,jsx}\"",
     "test": "jest --maxWorkers=2",
@@ -29,8 +28,8 @@
     "storybook": "start-storybook -p 6006",
     "build-storybook": "build-storybook"
   },
-  "main": "dist/index.js",
-  "module": "dist/index.esm.js",
+  "main": "dist/web3-ui-hooks.cjs.js",
+  "module": "dist/web3-ui-hooks.esm.js",
   "types": "dist/index.d.ts",
   "dependencies": {
     "@walletconnect/web3-provider": "^1.6.6",
@@ -43,8 +42,6 @@
   },
   "devDependencies": {
     "@babel/core": "^7.12.7",
-    "@rollup/plugin-commonjs": "^16.0.0",
-    "@rollup/plugin-node-resolve": "^10.0.0",
     "@storybook/addon-actions": "^6.4.0",
     "@storybook/addon-essentials": "^6.4.0",
     "@storybook/addon-links": "^6.4.0",
@@ -61,11 +58,6 @@
     "prettier": "^2.2.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
-    "rimraf": "^3.0.2",
-    "rollup": "^2.33.3",
-    "rollup-plugin-copy": "^3.3.0",
-    "rollup-plugin-terser": "7.0.2",
-    "rollup-plugin-typescript2": "^0.29.0",
     "ts-jest": "^26.4.4",
     "ts-loader": "^8.0.11",
     "typescript": "^4.1.0"

packages/hooks/src/index.ts

@@ -1,2 +1,3 @@
 export { useWallet } from './hooks';
-export { Provider, Web3Context, ProviderProps, Web3ContextType } from './Provider';
+export { Provider, Web3Context } from './Provider';
+export type { ProviderProps, Web3ContextType } from './Provider';

tsconfig.json

@@ -4,6 +4,7 @@
     "declaration": true,
     "esModuleInterop": true,
     "experimentalDecorators": true,
+    "isolatedModules": true,
     "jsx": "react",
     "lib": ["dom", "es5"],
     "module": "esNext",