Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Sylwia/adds monorepo support section #54

Open
wants to merge 10 commits into
base: main
Choose a base branch
from
4 changes: 4 additions & 0 deletions docs/codeflow/codeflow-faq.md
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,10 @@ Yes. Private repositories are available for free during beta through 2022. Start

At this moment we only support GitHub.com repositories.

### Can I run monorepos? Does Codeflow support workspaces?

Yes! Please see the walkthrough at [the "Working in Codeflow IDE" page](/codeflow/working-in-codeflow-ide#running-monorepos-in-codeflow-ide).

### Which files can be opened in Web Publisher?

Any file type can be opened in Web Publisher.
Expand Down
66 changes: 64 additions & 2 deletions docs/codeflow/working-in-codeflow-ide.md
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,6 @@ Follow these steps:

To integrate the bot, please follow the instructions on [Integrating CodeflowApp bot](./integrating-codeflowapp-bot.md).


## Troubleshooting

### Out of memory error
Expand All @@ -92,6 +91,10 @@ It may happen that having a few Codeflow IDE or StackBlitz projects open at the

<!-- @include: ../parts/error-out-of-memory.md -->

### Can't switch to a remote branch

Currently, when you load your repository, Codeflow only pulls in the branch you are trying to open or the default one. For now, to switch to a remote branch you can either fetch the branches (by running `git fetch` in the terminal) or immediately open the desired branch through its URL by following this pattern: `http://pr.new/github/${owner}/${repo}/tree/${branchName}`
sylwiavargas marked this conversation as resolved.
Show resolved Hide resolved

### Preview doesn't work

If the Preview doesn't work, oftentimes browser configuration or browser incompatibility is the culprit. Please see [this page for troubleshooting](/platform/webcontainers/browser-support).
Expand All @@ -108,4 +111,63 @@ Check in the terminal if the dev server is still running. If you want to restart

### Reopening the Preview panel

If you close the Preview by accident, you can reopen it by selecting the icon of a plug entitled "Ports in use" from the left-side navigation bar. Note that you can open the Preview in a separate tab or as a split screen.
If you close the Preview by accident, you can reopen it by selecting the icon of a plug entitled "Ports in use" from the left-side navigation bar. Note that you can open the Preview in a separate tab or as a split screen.

## Running monorepos in Codeflow IDE

Codeflow IDE supports workspaces. Follow a walkthrough below to get your monorepo running in Codeflow.

### npm

To define a workspace, add the `workspaces` field to the `package.json`:

```
"workspaces": [
"packages/*"
],
```

This refers to every sub-directory inside `packages` which contains a `package.json`.

Check [npm documentation](https://docs.npmjs.com/cli/v7/using-npm/workspaces) for more information.


### pnpm

To configure a workspace with pnpm, add the `pnpm-workspace.yaml` file to the root of the project:

```yaml
packages:
- 'packages/*'
```

Next, add a package from the workspace as a dependency to another package. In the example below we define `frontend` as dependent on `common`:
sylwiavargas marked this conversation as resolved.
Show resolved Hide resolved

```json
"dependencies": {
"common": "workspace:^1.0.0"
}
```

The `workspace:` protocol ensures the correct package from the workspace is used. However, this is not required because, by default, pnpm will link packages from the workspace if the available packages match the declared ranges.

Check [pnpm documentation](https://pnpm.io/workspaces) for more information.


### Yarn

To define a workspace with yarn, add the `workspaces` field to our `package.json`:

```
"workspaces": [
"packages/*"
],
```

This refers to every sub-directory inside `packages` which contains a `package.json`.

:::info
Note that a yarn workspace looks somewhat identical to an npm workspace. For the most parts that's true, but yarn also has [`nohoist`](https://classic.yarnpkg.com/blog/2018/02/15/nohoist).
:::

Check [yarn documentation](https://classic.yarnpkg.com/lang/en/docs/workspaces) for more information.
Loading