Change development scripts

Switch to npm-workspaces monorepo task management.

Author: necolas

.github/CONTRIBUTING.md

@@ -14,94 +14,76 @@ Fork, then clone the repo:
 git clone https://github.com/your-username/react-native-web.git
 ```
 
-Install dependencies (requires [yarn](https://yarnpkg.com/en/docs/install)):
+Install dependencies (requires Node.js >= 14.0):
 
 ```
-yarn
+npm install
 ```
 
-## Automated tests
+## Build
 
-To run the linter:
+Build a specific package:
 
 ```
-yarn lint
+npm run build -w <package-name>
 ```
 
-To run flow:
+For example, this will build `react-native-web`:
 
 ```
-yarn flow
+npm run build -w react-native-web
 ```
 
-To run the unit tests:
+Build all packages that can be built:
 
 ```
-yarn jest
+npm run build
 ```
 
-…in watch mode:
+## Develop
 
-```
-yarn jest --watch
-```
-
-To run all these automated tests:
-
-```
-yarn test
-```
-
-## Compile and build
-
-To compile the `react-native-web` source code:
+Develop a specific package:
 
 ```
-yarn compile
+npm run dev -w <package-name>
 ```
 
-…in watch mode:
+For example, this command will watch and rebuild the `react-native-web` package:
 
 ```
-yarn compile --watch
+npm run dev -w react-native-web
 ```
 
-## Documentation
-
-To run the documentation website:
+And this command will watch and rebuild the `react-native-web-examples` package:
 
 ```
-yarn docs
+npm run dev -w react-native-web-examples
 ```
 
-## Examples
+## Test
 
-To run the examples app:
+Run the monorepo linter:
 
 ```
-yarn examples
+npm run lint
 ```
 
-When you're also making changes to the 'react-native-web' source files, run this command in another process:
+Run the monorepo type checker:
 
 ```
-yarn compile --watch
+npm run flow
 ```
 
-## Benchmarks
-
-To run the benchmarks locally:
+Run the monorepo unit tests:
 
 ```
-yarn benchmarks
-open ./packages/benchmarks/dist/index.html
+npm run unit
 ```
 
-To develop against these benchmarks:
+Run all the automated tests:
 
 ```
-yarn compile --watch
-yarn benchmarks --watch
+npm run test
 ```
 
 ### New Features
@@ -115,7 +97,7 @@ Please open an issue with a proposal for a new feature or refactoring before sta
 1. Fork the repository and create your branch from `master`.
 2. If you've added code that should be tested, add tests!
 3. If you've changed APIs, update the documentation.
-4. Ensure the tests pass (`yarn test`).
+4. Ensure the tests pass (`npm run test`).
 
 You should see a pre-commit hook run before each commit. If it does not, you may need to reset you Git hookspath:
 
@@ -136,11 +118,11 @@ Thank you for contributing!
 To commit, publish, and push a final version:
 
 ```
-yarn release <version>
+npm run release -- <version>
 ```
 
 Release candidates or versions that you'd like to publish to npm, but do not want to produce a commit and push it to GitHub:
 
 ```
-yarn release <version> --skip-git
+npm run release -- <version> --skip-git
 ```

.github/workflows/performance.yml

@@ -9,7 +9,7 @@ jobs:
     - uses: actions/checkout@v2
     - uses: necolas/compressed-size-action@master
       with:
-        build-script: "compile"
+        build-script: "build -w react-native-web"
         exclude: "./packages/react-native-web/dist/cjs/{index.js,**/*.js}"
         pattern: "./packages/react-native-web/dist/{index.js,**/*.js}"
         repo-token: "${{ secrets.GITHUB_TOKEN }}"

.github/workflows/react-integration.yml

@@ -13,9 +13,8 @@ jobs:
     - uses: actions/setup-node@v1
       with:
         node-version: '14.x'
-    - run: npm install -g yarn
-    - run: yarn install
+    - run: npm install
     # Install next-tagged versions
-    - run: yarn upgrade react@next react-dom@next -W --dev
+    - run: npm update react@next react-dom@next
     # Only run the unit tests
-    - run: yarn jest
+    - run: npm run unit

.github/workflows/tests.yml

@@ -15,9 +15,8 @@ jobs:
     - uses: actions/setup-node@v1
       with:
         node-version: '14.x'
-    - run: npm install -g yarn
-    - run: yarn install
-    - run: yarn fmt:report
+    - run: npm install
+    - run: npm run format
 
   type-check:
     runs-on: ubuntu-latest
@@ -26,9 +25,8 @@ jobs:
     - uses: actions/setup-node@v1
       with:
         node-version: '14.x'
-    - run: npm install -g yarn
-    - run: yarn install
-    - run: yarn flow
+    - run: npm install
+    - run: npm run flow
 
   lint:
     runs-on: ubuntu-latest
@@ -37,9 +35,8 @@ jobs:
     - uses: actions/setup-node@v1
       with:
         node-version: '14.x'
-    - run: npm install -g yarn
-    - run: yarn install
-    - run: yarn lint:report
+    - run: npm install
+    - run: npm run lint
 
   unit-test:
     runs-on: ubuntu-latest
@@ -48,6 +45,5 @@ jobs:
     - uses: actions/setup-node@v1
       with:
         node-version: '14.x'
-    - run: npm install -g yarn
-    - run: yarn install
-    - run: yarn jest
+    - run: npm install
+    - run: npm run unit

.watchmanconfig

@@ -0,0 +1 @@
+{}

README.md

@@ -13,6 +13,18 @@
 * `scripts`
   * Contains Node.js scripts for miscellaneous tasks.
 
+## Tasks
+
+* `build`
+  * Use `npm run build` to run the build script in every package.
+  * Use `npm run build -w <package-name>` to run the build script for a specific package.
+* `dev`
+  * Use `npm run dev` to run the dev script in every package.
+  * Use `npm run dev -w <package-name>` to run the dev script for a specific package.
+* `test`
+  * Use `npm run test` to run tests for every package.
+  * Use `npm run test` to run tests for every package.
+
 ## Contributing
 
 Development happens in the open on GitHub and we are grateful for contributions including bugfixes, improvements, and ideas.

package.json

@@ -1,33 +1,25 @@
 {
   "private": true,
   "version": "0.0.0",
-  "name": "monorepo",
+  "name": "react-ui-monorepo",
   "scripts": {
     "clean": "del-cli ./packages/*/dist",
-    "compile": "npm-run-all clean -p \"compile:* {@}\" --",
-    "compile:commonjs": "cd packages/react-native-web && cross-env BABEL_ENV=commonjs babel --config-file ../../configs/babel.config.js src --out-dir dist/cjs --ignore \"**/__tests__\"",
-    "compile:es": "cd packages/react-native-web && babel --config-file ../../configs/babel.config.js src --out-dir dist --ignore \"**/__tests__\"",
-    "compile:flow": "gen-flow-files packages/react-native-web/src --out-dir packages/react-native-web/dist",
-    "benchmarks": "cd packages/benchmarks && yarn dev",
-    "benchmarks:build": "cd packages/benchmarks && yarn build",
-    "benchmarks:release": "yarn benchmarks:build && git checkout gh-pages && rm -rf ./docs/benchmarks && mv packages/benchmarks/dist ./docs/benchmarks && git add -A && git commit -m \"Deploy benchmarks\" && git push origin gh-pages && git checkout -",
-    "docs": "cd packages/react-native-web-docs && yarn dev",
-    "docs:build": "cd packages/react-native-web-docs && yarn build",
-    "docs:release": "yarn docs:build && git checkout gh-pages && rm -rf ./docs && mv packages/react-native-web-docs/dist ./docs && git add ./docs && git commit -m \"Deploy documentation\" && git push origin gh-pages && git checkout -",
-    "examples": "cd packages/react-native-web-examples && yarn dev",
-    "examples:build": "cd packages/react-native-web-examples && yarn build",
+    "build": "npm run clean && npm run build --workspaces --if-present",
+    "dev": "npm run dev --workspaces --if-present",
     "flow": "flow --flowconfig-name ./configs/.flowconfig",
-    "fmt": "prettier --write \"**/*.js\" --ignore-path ./configs/.prettierignore",
-    "fmt:report": "prettier --check --ignore-path ./configs/.prettierignore \"**/*.js\"",
-    "jest": "npm-run-all \"jest:* {@}\" --",
-    "jest:dom": "jest --config ./configs/jest.config.js",
-    "jest:node": "jest --config ./configs/jest.config.node.js",
-    "lint": "yarn lint:report --fix",
-    "lint:report": "eslint configs packages scripts --config ./configs/.eslintrc",
-    "prerelease": "yarn test && yarn compile",
+    "format": "prettier --check --ignore-path ./configs/.prettierignore \"**/*.js\"",
+    "format:fix": "prettier --write \"**/*.js\" --ignore-path ./configs/.prettierignore",
+    "lint": "eslint configs packages scripts --config ./configs/.eslintrc",
+    "lint:fix": "npm run lint --fix",
+    "prerelease": "npm run test && npm run build",
     "release": "node ./scripts/releaseReactNativeWebPackages.js",
-    "postrelease": "yarn docs:release && yarn benchmarks:release",
-    "test": "yarn flow && yarn fmt:report && yarn lint:report && yarn jest --runInBand"
+    "release:benchmarks": "git checkout gh-pages && rm -rf ./docs/benchmarks && mv packages/benchmarks/dist ./docs/benchmarks && git add -A && git commit -m \"Deploy benchmarks\" && git push origin gh-pages && git checkout -",
+    "release:react-native-web-docs": "git checkout gh-pages && rm -rf ./docs && mv packages/react-native-web-docs/dist ./docs && git add ./docs && git commit -m \"Deploy documentation\" && git push origin gh-pages && git checkout -",
+    "postrelease": "npm run release:react-native-web-docs && npm run release:benchmarks",
+    "test": "npm run flow && npm run format && npm run lint && npm run unit --runInBand",
+    "unit": "npm-run-all \"unit:* {@}\" --",
+    "unit:dom": "jest --config ./configs/jest.config.js",
+    "unit:node": "jest --config ./configs/jest.config.node.js"
   },
   "devDependencies": {
     "@babel/cli": "^7.12.13",
@@ -83,9 +75,9 @@
       "git add ./packages/babel-plugin-react-native-web/src/moduleMap.js"
     ],
     "**/*.js": [
-      "prettier --write --ignore-path ./configs/.prettierignore",
-      "git update-index --again",
-      "yarn lint"
+      "npm run format:fix",
+      "npm run lint:fix",
+      "git update-index --again"
     ]
   },
   "prettier": {

packages/babel-plugin-react-native-web/README.md

@@ -49,4 +49,4 @@ import View from 'react-native-web/dist/exports/View';
 ```
 
 [package-badge]: https://img.shields.io/npm/v/babel-plugin-react-native-web.svg?style=flat
-[package-url]: https://yarnpkg.com/en/package/babel-plugin-react-native-web
+[package-url]: https://www.npmjs.com/package/babel-plugin-react-native-web

packages/benchmarks/README.md

@@ -2,20 +2,14 @@
 
 Try the [benchmarks app](https://necolas.github.io/react-native-web/benchmarks) online.
 
-To run the benchmarks locally from monorepo root:
+To work on the benchmarks locally from monorepo root:
 
 ```
-yarn benchmarks
+npm run dev -w react-native-web
+npm run build -w benchmarks
 open ./packages/benchmarks/dist/index.html
 ```
 
-Develop against these benchmarks from monorepo root:
-
-```
-yarn compile --watch
-yarn benchmarks --watch
-```
-
 ## Notes
 
 These benchmarks are approximations of extreme cases that libraries may

packages/benchmarks/package.json

@@ -3,8 +3,9 @@
   "name": "benchmarks",
   "version": "0.0.0",
   "scripts": {
-    "dev": "mkdir -p dist && cp -f index.html dist/index.html && ./node_modules/.bin/webpack-cli --config ./webpack.config.js",
-    "build": "NODE_ENV=production yarn dev"
+    "clean": "del-cli ./dist",
+    "build": "NODE_ENV=production npm run dev",
+    "dev": "npm run clean && mkdir -p dist && cp -f index.html dist/index.html && ./node_modules/.bin/webpack-cli --config ./webpack.config.js"
   },
   "dependencies": {
     "classnames": "^2.3.1",

packages/react-native-web-examples/package.json

@@ -3,8 +3,8 @@
   "name": "react-native-web-examples",
   "version": "0.18.3",
   "scripts": {
-    "dev": "next",
     "build": "next build",
+    "dev": "next",
     "start": "next start"
   },
   "dependencies": {

packages/react-native-web/package.json

@@ -13,6 +13,14 @@
     "src",
     "!**/__tests__"
   ],
+  "scripts": {
+    "clean": "del-cli ./dist",
+    "build": "npm-run-all clean -p \"build:* {@}\" --",
+    "build:commonjs": "cross-env BABEL_ENV=commonjs babel src --config-file ../../configs/babel.config.js --out-dir dist/cjs --ignore \"**/__tests__\"",
+    "build:es": "babel src --config-file ../../configs/babel.config.js --out-dir dist --ignore \"**/__tests__\"",
+    "build:flow": "gen-flow-files ./src --out-dir ./dist",
+    "dev": "npm-run-all clean -p \"build:* {@} -- --watch\""
+  },
   "dependencies": {
     "@babel/runtime": "^7.18.6",
     "create-react-class": "^15.7.0",