App Deployment

The tag and snap pipelines of an app component include an additional build task that deploys the app's artifacts.

To snap and deploy your app, run the following:

$bit snap --message "update app"

Copied

To snap with a release version, and deploy your app, run the following:

$bit tag apps/my-app --message "update app"

Copied

Bit's official Vue application type does not provide its own deployer. Search bit.cloud for a deployer, and set it in your app's plugin file.

For example:

Run the following to install the Netlify deployer:

$bit install @teambit/cloud-providers.deployers.netlify

Copied

Set the Netlify deployer in your app plugin file (my-app.vue-app.cjs):

// my-app.vue-app.cjs

const { Netlify } = require("@teambit/cloud-providers.deployers.netlify");

const netlifyConfig = {
  // The slug of your Netlify profile.
  team: '<your-slug>',
  // The access token of your Netlify profile.
  accessToken: process.env.NETLIFY_AUTH_TOKEN || '',
  // The name of the site to deploy to when bit tag.
  productionSiteName: '<your-site-name>',
  // The name of the staging site to deploy to when bit snap. (optional)
  stagingSiteName: '<your-staging-site-name>',
};

const deployToNetlify = (context) => {
  return Netlify.deploy(netlifyConfig)(context);
};

module.exports = MyApp = {
  // ...
  deploy: deployToNetlify,
  // ...
};
Copied

Note that the app plugin file my-app.vue-app.cjs is not in ES Module but CommonJS format since this file need to be run directly in Node runtime.

See example component.

You can choose not to use the deployment function, and instead deploy the app's artifacts using your existing CI. For this, make sure to disable you deployment function, and to snap your app component (artifacts can only be extracted from a snap).

$bit artifacts my-org.my-scope/apps/my-app --task build_application --out-dir build

Copied

The artifacts are now available in the new build directory, at the root of your project. Use this directory to deploy with your existing tools and workflows. For example:

$netlify deploy --dir=build

Copied