Skip to content

Get started

WARNING

Cloudpack is a work in progress; documentation, API surface, etc are all in pre-release state and subject to change/may be incomplete.

Setting up Cloudpack

The example commands on this page assume yarn as a package manager, but Cloudpack should work with most package managers (Yarn PnP not supported).

Most repos will add package.json scripts for common Cloudpack commands, but the examples below assume running the commands via the package manager directly (yarn in the examples, but should work with any manager).

  1. Install @ms-cloudpack/cli as a dev dependency of your app.

  2. If your app is simple, it might work in Cloudpack without any extra configuration. Try running yarn cloudpack start and see what happens!

  3. If Cloudpack can't find your app's entry point, create a file cloudpack.config.json and configure routes. A common example is below, but see the routing docs for more possibilities. You might also need to configure server options depending on your setup.

    jsonc
    {
      "$schema": "https://unpkg.com/@ms-cloudpack/cli/schema/AppConfig.json",
      "routes": [
        {
          // Common setup:
          // The default route is at the server root
          "match": "/",
          // It corresponds to a TS file
          "entry": "./src/App.tsx",
          // And optionally uses an HTML file as a base.
          "serverEntry": "./public/index.html",
        },
      ],
    }
  4. If there are errors about dependencies or unrecognized imports, try running yarn cloudpack init. This will be necessary in most larger apps.

If you're still having issues, check out the troubleshooting info for start or init, or feel free to ask a team member in https://aka.ms/cloudpack-help.

Linking a package to your app

If you have a package that you want to develop against your running app, you can use the cloudpack link command. It creates a link between your app and the package so you can develop both simultaneously and see changes in almost real-time.

  1. Start your app with yarn cloudpack start.
  2. In a separate terminal, navigate to the package folder you want to link.
  3. Run yarn cloudpack link in the package folder.
  4. Edit your package and see the changes reflected in your app almost immediately.
  5. When done, run yarn cloudpack unlink in the package folder.

You can also run yarn cloudpack link --all in a parent folder (e.g. /some-repo/packages) to link every package under that folder, along with their transitive dependencies located within the same repo.

See the link command docs for the full list of options and troubleshooting info.

Note: The link command works best if the linked package's repo follows Cloudpack's repo guidance.

Next steps

To learn more about the capabilities of Cloudpack, have a look at the design overview and CLI docs.

If you have more questions or your team is interested in potentially being an early adopter of Cloudpack, please reach out! As an early adopter, your team will get to help shape the direction of the project, and we'll work together to ensure Cloudpack meets your repo's needs.