Skip to content

Commit a730073

Browse files
RobinMalfaitRobinMalfait
authored
Ensure playgrounds work + switch to npm workspaces (#2907)
* bump Next in playground * convert legacy Link after Next.js bump * update yarn.lock * switch to npm workspaces * move `packages/playground-*` to `playgrounds/*` * use `npm` instead of `yarn` * sync package-lock.json * use node 20 for insiders releases
1 parent 3b961a6 commit a730073

File tree

120 files changed

+10733
-6944
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

120 files changed

+10733
-6944
lines changed

‎.github/CONTRIBUTING.md‎

Lines changed: 43 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -19,14 +19,14 @@ Also make sure that you are making changes to both the `React` and `Vue` version
1919

2020
## Monorepo
2121

22-
The Headless UI repo is a monorepo using `yarn` workspaces. Note that we are using `yarn` **version 1**.
22+
The Headless UI repo is a monorepo using `npm` workspaces.
2323

2424
## Installation
2525

26-
You only require a `yarn install` in the root directory to install everything you need.
26+
You only require a `npm install` in the root directory to install everything you need.
2727

2828
```sh
29-
yarn install
29+
npm install
3030
```
3131

3232
## Coding standards
@@ -35,28 +35,28 @@ We use `prettier` for making sure that the codebase is formatted consistently.
3535
To automatically fix any style violations in your code, you can run:
3636

3737
```sh
38-
yarn lint
38+
npm lint
3939
```
4040

4141
**Note**: Whenever you commit, the lint check will run on all staged files.
42-
**Note**: In CI, we will only check your code, and not write with the formatted files. If you want to just check, then you can either run `yarn lint-check` or `CI=true yarn lint`
42+
**Note**: In CI, we will only check your code, and not write with the formatted files. If you want to just check, then you can either run `npm run lint-check` or `CI=true npm run lint`
4343

4444
## Running tests
4545

4646
You can run the test suite using the following commands:
4747

4848
```sh
49-
yarn test
49+
npm run test
5050
```
5151

5252
You can also run them for React or Vue individually:
5353

5454
```sh
55-
yarn react test
55+
npm run react test
5656

5757
# or
5858

59-
yarn vue test
59+
npm run vue test
6060
```
6161

6262
Please ensure that the tests are passing when submitting a pull request. If you're adding new features to Headless UI, please include tests.
@@ -68,11 +68,11 @@ Currently the `React` playground (located in `packages/playground-react`) is a N
6868
You can launch them by running:
6969

7070
```sh
71-
yarn react playground
71+
npm run react playground
7272

7373
# or
7474

75-
yarn vue playground
75+
npm run vue playground
7676
```
7777

7878
This will also start the necessary watchers so that you don't have to care about them.
@@ -81,41 +81,41 @@ This will also start the necessary watchers so that you don't have to care about
8181

8282
Global scripts, and some aliases:
8383

84-
- `yarn install`: install all dependencies for all packages
85-
- `yarn clean`: this will call all `yarn {package} clean` commands
86-
- `yarn build`: this will call all `yarn {package} build` commands
87-
- `yarn lint`: this will `lint` all packages
88-
- `yarn test`: this will `test` all packages
89-
- `yarn test`: run all jest tests
90-
- `yarn test --watch`: run all jest tests in interactive mode
91-
- `yarn test tabs`: run all jest tests filtered by `tabs`
92-
- `yarn test tabs --watch`: run all jest tests in interactive mode filtered by `tabs`
84+
- `npm install`: install all dependencies for all packages
85+
- `npm run clean`: this will call all `npm run {package} clean` commands
86+
- `npm run build`: this will call all `npm run {package} build` commands
87+
- `npm run lint`: this will `lint` all packages
88+
- `npm run test`: this will `test` all packages
89+
- `npm run test`: run all jest tests
90+
- `npm run test --watch`: run all jest tests in interactive mode
91+
- `npm run test tabs`: run all jest tests filtered by `tabs`
92+
- `npm run test tabs --watch`: run all jest tests in interactive mode filtered by `tabs`
9393

9494
Scripts per package:
9595

96-
- `yarn react`: Prefix to run anything in the `@headlessui/react` package
97-
- `yarn react test`: run all jest tests
98-
- `yarn react test --watch`: run all jest tests in interactive mode
99-
- `yarn react test tabs`: run all jest tests filtered by `tabs`
100-
- `yarn react test tabs --watch`: run all jest tests in interactive mode filtered by `tabs`
101-
- `yarn react build`: build the final artefacts
102-
- `yarn react lint`: validate and fix the react codebase using prettier
103-
- `yarn react watch`: start a watcher for the react esm build
104-
- **Note**: this will be executed for you when using the `yarn react playground`
96+
- `npm run react`: Prefix to run anything in the `@headlessui/react` package
97+
- `npm run react test`: run all jest tests
98+
- `npm run react test --watch`: run all jest tests in interactive mode
99+
- `npm run react test tabs`: run all jest tests filtered by `tabs`
100+
- `npm run react test tabs --watch`: run all jest tests in interactive mode filtered by `tabs`
101+
- `npm run react build`: build the final artefacts
102+
- `npm run react lint`: validate and fix the react codebase using prettier
103+
- `npm run react watch`: start a watcher for the react esm build
104+
- **Note**: this will be executed for you when using the `npm run react playground`
105105
- **Note**: this is not required for jest. You will probably never need this
106-
- `yarn react playground`: (alias) start a development server in the `playground-react` package
107-
- **Note**: this will also run `yarn react watch` for you, which means that you only need to execute `yarn react playground`
108-
- `yarn react clean`: this will remove `dist` files
109-
- `yarn vue`: Prefix to run anything in the `@headlessui/vue` package
110-
- `yarn vue test`: run all jest tests
111-
- `yarn vue test --watch`: run all jest tests in interactive mode
112-
- `yarn vue test tabs`: run all jest tests filtered by `tabs`
113-
- `yarn vue test tabs --watch`: run all jest tests in interactive mode filtered by `tabs`
114-
- `yarn vue build`: build the final artefacts
115-
- `yarn vue lint`: validate and fix the vue codebase using prettier
116-
- `yarn vue watch`: start a watcher for the vue esm build
117-
- **Note**: this will be executed for you when using the `yarn vue playground`
106+
- `npm run react playground`: (alias) start a development server in the `playground-react` package
107+
- **Note**: this will also run `npm run react watch` for you, which means that you only need to execute `npm run react playground`
108+
- `npm run react clean`: this will remove `dist` files
109+
- `npm run vue`: Prefix to run anything in the `@headlessui/vue` package
110+
- `npm run vue test`: run all jest tests
111+
- `npm run vue test --watch`: run all jest tests in interactive mode
112+
- `npm run vue test tabs`: run all jest tests filtered by `tabs`
113+
- `npm run vue test tabs --watch`: run all jest tests in interactive mode filtered by `tabs`
114+
- `npm run vue build`: build the final artefacts
115+
- `npm run vue lint`: validate and fix the vue codebase using prettier
116+
- `npm run vue watch`: start a watcher for the vue esm build
117+
- **Note**: this will be executed for you when using the `npm run vue playground`
118118
- **Note**: this is not required for jest. You will probably never need this
119-
- `yarn vue playground`: (alias) start a development server in the `playground-vue` package
120-
- **Note**: this will also run `yarn vue watch` for you, which means that you only need to execute `yarn react playground`
121-
- `yarn vue clean`: this will remove `dist` files
119+
- `npm run vue playground`: (alias) start a development server in the `playground-vue` package
120+
- **Note**: this will also run `npm run vue watch` for you, which means that you only need to execute `npm run react playground`
121+
- `npm run vue clean`: this will remove `dist` files

‎.github/workflows/main.yml‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -26,9 +26,9 @@ jobs:
2626
- uses: actions/cache@v3
2727
with:
2828
path: '**/node_modules'
29-
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/yarn.lock') }}
29+
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/package-lock.json') }}
3030
- name: Install dependencies
31-
run: yarn install --frozen-lockfile
31+
run: npm ci
3232
env:
3333
CI: true
3434

@@ -42,9 +42,9 @@ jobs:
4242
- uses: actions/cache@v3
4343
with:
4444
path: '**/node_modules'
45-
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/yarn.lock') }}
45+
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/package-lock.json') }}
4646
- name: Lint
47-
run: yarn lint
47+
run: npm run lint
4848
env:
4949
CI: true
5050

@@ -58,10 +58,10 @@ jobs:
5858
- uses: actions/cache@v3
5959
with:
6060
path: '**/node_modules'
61-
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/yarn.lock') }}
61+
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/package-lock.json') }}
6262
- name: Test
6363
run: |
64-
yarn test || yarn test || yarn test || exit 1
64+
npm run test || npm run test || npm run test || exit 1
6565
env:
6666
CI: true
6767

@@ -75,9 +75,9 @@ jobs:
7575
- uses: actions/cache@v3
7676
with:
7777
path: '**/node_modules'
78-
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/yarn.lock') }}
78+
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/package-lock.json') }}
7979
- name: Build
80-
run: yarn build
80+
run: npm run build
8181
env:
8282
CI: true
8383

@@ -91,8 +91,8 @@ jobs:
9191
- uses: actions/cache@v3
9292
with:
9393
path: '**/node_modules'
94-
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/yarn.lock') }}
94+
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/package-lock.json') }}
9595
- name: Check Types
96-
run: yarn lint-types
96+
run: npm run lint-types
9797
env:
9898
CI: true

‎.github/workflows/release-insiders.yml‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ jobs:
1414

1515
strategy:
1616
matrix:
17-
node-version: [18]
17+
node-version: [20]
1818

1919
steps:
2020
- uses: actions/checkout@v3
@@ -30,18 +30,18 @@ jobs:
3030
uses: actions/cache@v3
3131
with:
3232
path: '**/node_modules'
33-
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/yarn.lock') }}
33+
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/package-lock.json') }}
3434
restore-keys: |
3535
nodeModules-
3636
3737
- name: Install dependencies
38-
run: yarn install --frozen-lockfile
38+
run: npm ci
3939
env:
4040
CI: true
4141

4242
- name: Test
4343
run: |
44-
yarn test || yarn test || yarn test || exit 1
44+
npm run test || npm run test || npm run test || exit 1
4545
env:
4646
CI: true
4747

‎.github/workflows/release.yml‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -36,18 +36,18 @@ jobs:
3636
uses: actions/cache@v3
3737
with:
3838
path: '**/node_modules'
39-
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/yarn.lock') }}
39+
key: ${{ runner.os }}-${{ env.NODE_VERSION }}-modules-${{ hashFiles('**/package-lock.json') }}
4040
restore-keys: |
4141
nodeModules-
4242
4343
- name: Install dependencies
44-
run: yarn install --frozen-lockfile
44+
run: npm ci
4545
env:
4646
CI: true
4747

4848
- name: Test
4949
run: |
50-
yarn test || yarn test || yarn test || exit 1
50+
npm run test || npm run test || npm run test || exit 1
5151
env:
5252
CI: true
5353

‎.gitignore‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,24 +3,29 @@
33
# dependencies
44
/node_modules
55
/packages/**/node_modules
6+
/playgrounds/**/node_modules
67

78
# testing
89
/coverage
910
/packages/**/coverage
11+
/playgrounds/**/coverage
1012

1113
# logs
1214
*.log
1315
/packages/**/*.log
16+
/playgrounds/**/*.log
1417

1518
# next.js
1619
/.next/
17-
/packages/**/.next/
20+
/playgrounds/**/.next/
1821
/out/
1922
/packages/**/out/
23+
/playgrounds/**/out/
2024

2125
# production
2226
/dist
2327
/packages/**/dist
28+
/playgrounds/**/dist
2429

2530
# misc
2631
.DS_Store

0 commit comments

Comments
 (0)