You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: .changeset/giant-phones-jog.md
+1-2Lines changed: 1 addition & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -3,8 +3,7 @@
3
3
'@lg-tools/cli': minor
4
4
---
5
5
6
-
- Add more detailed color-prefixed process logging to spawned commands in link tool
7
6
- Added new flags to `link` script to cover broader use cases:
8
7
-`--no-parallel`: Run the link command sequentially for each package. Useful for when the default parallel approach fails
9
-
-`--launch-env`: A string of environment variable lines as `KEY=VALUE`, separated by a newline. Only the specified environment variables will be used during npm link commands in the source and destination directories. This is useful to workaround environment variable pollution by tools such as version managers (e.g., asdf) or script runners (e.g., pnpm) that interfere with `npm link`. We recommend using `--launch-env="$(env)"` to use your original shell environment.
8
+
-`--launch-env`: A string of environment variable lines as `KEY=VALUE`, separated by a newline. Only the specified environment variables will be used during npm link commands in the source and destination directories. This is useful to workaround environment variable pollution by tools such as version managers (e.g., asdf) or script runners (e.g., pnpm) that override the script's environment which impacts the launched `npm link` commands. We recommend using `--launch-env="$(env)"` to use your original shell environment.
10
9
- Improve documentation for linking in DEVELOPER.md
Copy file name to clipboardExpand all lines: DEVELOPER.md
+24-9Lines changed: 24 additions & 9 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -68,14 +68,14 @@ When you run the scaffold script, a `README` file will appear, which is a templa
68
68
69
69
### Locally
70
70
71
-
We use @testing-library/react for writing tests locally. This library helps mock out user interactions with components. You can run all tests by running `yarn test` or turn on watch mode with `yarn test --watch`.
71
+
We use @testing-library/react for writing tests locally. This library helps mock out user interactions with components. You can run all tests by running `pnpm test` or turn on watch mode with `pnpm test --watch`.
72
72
73
73
### Linking
74
74
75
75
We provide a `link` script to help you test in-development components within environments outside of Storybook. To do this, run:
76
76
77
77
```
78
-
yarn run link --to=[path-to-application]
78
+
pnpm run link --to=[path-to-application]
79
79
```
80
80
81
81
If you encounter issues while linking, try the following troubleshooting flags:
@@ -94,6 +94,21 @@ If you encounter issues while linking, try the following troubleshooting flags:
94
94
},
95
95
```
96
96
97
+
Note: There are some known issues using `pnpm link` from pnpm workspaces. Using Verdaccio, while
98
+
more involved, is the more reliable and recommended approach for testing in an external project.
99
+
100
+
### Using a local registry (Verdaccio)
101
+
102
+
Publishing test versions to a local registry can be helpful when you need to make changes and test
103
+
in an external app (or other library). To do this, you can install and
104
+
use [Verdaccio](https://verdaccio.org/)
105
+
106
+
#### 1. Install `verdaccio`
107
+
108
+
```bash
109
+
pnpm install --global verdaccio
110
+
```
111
+
97
112
#### 2. Start `verdaccio`, and make note on the localhost port (should be `http://localhost:4873/` by default)
98
113
99
114
```bash
@@ -123,12 +138,12 @@ You should expect to see the following line in that file. (if not you can add it
123
138
Ensure all packages are built, then navigate to some package and manually publish:
124
139
125
140
```bash
126
-
yarn build;
141
+
pnpm build;
127
142
cd packages/<package-name>;
128
-
yarn publish;
143
+
pnpm publish;
129
144
```
130
145
131
-
To ensure you are pointing to the correct registry, you can add the `--dry-run` flag to the `yarn publish` command. This command should echo:
146
+
To ensure you are pointing to the correct registry, you can add the `--dry-run` flag to the `pnpm publish` command. This command should echo:
132
147
133
148
```
134
149
npm notice Publishing to http://localhost:4873
@@ -155,23 +170,23 @@ With your local version published, open up some external app. If the app uses a
155
170
Next, install the newly published version of your package in the external project.
156
171
157
172
```bash
158
-
yarn install @leafygreen-ui/<package-name>
173
+
pnpm install @leafygreen-ui/<package-name>
159
174
```
160
175
161
176
#### 6. Publishing additional versions
162
177
163
-
To publish additional versions, manually the version number in `packages/<package-name>/package.json`, and re-run step 4. Then, either manually update the external project's `package.json`, or re-run `yarn install @leafygreen-ui/<package-name>`.
178
+
To publish additional versions, manually the version number in `packages/<package-name>/package.json`, and re-run step 4. Then, either manually update the external project's `package.json`, or re-run `pnpm install @leafygreen-ui/<package-name>`.
164
179
165
180
#### 7. Publishing to NPM
166
181
167
182
If you want to stop publishing to and/or reading from your local Verdaccio server, remove the reference to the server URL in `~/.npmrc` (and the external project's local `.npmrc`/`.yarnrc`)
168
183
169
184
## Creating a new component
170
185
171
-
- Run `yarn create-package <package-name>` to create a new component directory with default configurations
186
+
- Run `pnpm create-package <package-name>` to create a new component directory with default configurations
172
187
- Add the new component to `build.tsconfig.json`
173
188
- If you are using any `leafygreen-ui` dependencies in your new component, add the dependency to the component directory's `tsconfig.json`.
174
-
- Run `yarn run init` to link all packages before starting development
189
+
- Run `pnpm run init` to link all packages before starting development
175
190
176
191
## Marking a Storybook story to be imported in mongodb.design
0 commit comments