Run bvm upgrade to get the latest stable version of Bit. See Install experimental releases to try out the latest experimental features.

The legacy React env and legacy react apps can be configured to use a different instance of webpack and webpack dev server.

This has already been an option for the new envs and will soon be available for new React apps.

For example, the following sets a different version of webpack and webpack dev server for the React env/app:

React env

React env legacy

/* @filename: my-react-env.bit-env.ts */

/* your base env */
import { ReactEnv } from '@teambit/react.react-env';

import { ReactPreview } from '@teambit/preview.react-preview';
import type { EnvHandler } from '@teambit/envs';
import { Preview } from '@teambit/preview';

export class MyReactEnv extends ReactEnv {
  preview(): EnvHandler<Preview> {
    return ReactPreview.from({
      /* use the path to the webpack version this env has as a dependency */
      webpackModulePath: require.resolve('webpack'),
      webpackDevServerModulePath: require.resolve('webpack-dev-server'),
    });
  }
}

export default new MyReactEnv();

Copied

The specific versions of webpack and webpack dev server are determined by the versions set for the env/app. For example:

$bit deps set my-react-env webpack@5.64.4 webpack-dev-server@4.6.0

Copied

bit deps set is used in this case (to set the dependencies manually) since there are no import/require statements to webpack in the component's files (which means Bit is unable to detect the dependencies automatically).

$bit install

Copied

Webpack upgraded from version 5.51.0 to version 5.81.1.

Webpack Dev Server upgraded from version 4.1.1 to version 4.15.0.

The new webpack version might not be fully compatible with custom plugins and loaders you might be using for your envs and apps. If that is the case, either replace them with compatible ones or override the webpack version for your envs and apps (see the previous section).

The deprecated --reset option is now removed. Use the reset argument instead.

$bit checkout reset

Copied

The deprecated --skip-npm-install option is now removed. Use the --skip-dependency-installation option instead.

$bit checkout head --skip-dependency-installation

Copied

Pre-built Workspace UI artifacts are served to boost bit start loading time. This translates to a 50% faster loading time for the Workspace UI, on first cold-start.

Workspace components are no longer loaded on bit run APP_NAME. This drives faster loading time for apps.

Aspects that are listed as another aspect dependencies (static dependencies = []) are only loaded if they are listed in the workspace.jsonc.

Note that aspect dependencies should be listed in the workspace.jsonc otherwise, they are not loaded automatically. This improves performance, however, it requires aspect maintainers to handle undefined (when an aspect is not loaded).

We're happy to announce Bit is fully compatible with Angular 16. To learn more, see our Angular docs.

A new HTML env is now available. The env is uses the new envs API.

The env is useful for components for the browser, that are not framework-specific. This includes, JavaScript, TypeScript, CSS, SASS, and more.

See this blog post to learn more about using this env

See this blog post to learn more about using this env for a step-by-step guide on how to create reusable CSS components with Bit. CSS components are a great way to share CSS/SASS variables and mixins with other components.

Checkout the React Native learn section to learn how to create independent React Native components with Bit.

This blog uses a full-stack React with Express app as an example. However, the same principles apply to any other app.

See the Github repo for the full code, in three stages:

1. The original pre-Bit project
2. The project after componentization
3. The project after full componentization, including the apps themselves. In this stage, the project's CI/CD was "handed over" to the app components.

See the Bit organization.