kibana/kbn_pm
Clint Andrew Hall d0fde5f8e1
[React@18] Env variable to use React@18 (#193113)
Part of
https://github.com/elastic/kibana-team/issues/1016#issuecomment-2454845292

Our plan for React@18 packages upgrade is to let kibana contributors now
that we're going to bump React packages couple weeks in advance. In
addtion to the final PR with green tests and Kibana deployed, we want to
give simple instructions on how to run React@18 locally easilly:

This PR allows to quickly toggle between version of React locally
without having to do anything beyond an environment variable.

`REACT_18=true yarn bootstrap` will alias `react` and `react-dom` to v18
in the build.

I check that this works as expected when starting from: 

- local dev server `yarn start` 
- local ftr `node scripts/functional_tests_server.js`
- local unit tests `REACT_18=true yarn test:jest ...`

Please note: 
- **This PR doesn't implement this switch for dist build, as I don't
think we need this for our purposes.**
- The plan is that we remove this switch soon after we merge React@18
upgrade to main.

In addition to the switch this PR mutes a very noisy warning from
React@18 about legacy root `Warning: ReactDOM.render is no longer
supported in React 18. Use createRoot instead. Until you switch to the
new API, your app will behave as if it's running React 17.`. This
warning is expected as after we upgrade to React@18 packages (Phase 1)
we will be in the process of migrating to the new createRoot API (Phase
2). However, it is very noisy and we want to mute it for now.


Co-authored-by: Anton Dosov <anton.dosov@elastic.co>
2024-12-09 13:55:14 +01:00
..
src [React@18] Env variable to use React@18 (#193113) 2024-12-09 13:55:14 +01:00
README.mdx Transpile packages on demand, validate all TS projects (#146212) 2022-12-22 19:00:29 -06:00
tsconfig.json [packages] migrate all plugins to packages (#148130) 2023-02-08 21:06:50 -06:00

---
id: kibDevDocsOpsKbnPm
slug: /kibana-dev-docs/ops/kbn-pm
title: "@kbn/pm"
description: 'The tool which bootstraps the repo and helps work with packages'
date: 2022-07-14
tags: ['kibana', 'dev', 'contributor', 'operations', 'packages', 'scripts']
---

`@kbn/pm` is the tool that we use to bootstrap the Kibana repository, build packages with Bazel, and run scripts in packages.

## commands

### `yarn kbn bootstrap`

Use this command to install dependencies, build packages, and prepare the repo for local development.

### `yarn kbn watch`

Use this command to build all packages and make sure that they are rebuilt as you make changes.

### and more!

There are several commands supported by `@kbn/pm`, but rather than documenting them here they are documented in the help text. Please run `yarn kbn --help` locally to see the most up-to-date info.

## Why isn't this TypeScript?

Since this tool is required for bootstrapping the repository it needs to work without any dependencies installed and without a build toolchain. We accomplish this by writing the tool in vanilla JS (shocker!) and using TypeScript to validate the code which is typed via heavy use of JSDoc comments.

In order to use import/export syntax and enhance the developer experience a little we use the `.mjs` file extension.

In some cases we actually do use TypeScript files, just for defining complicated types. These files are then imported only in special TS-compatible JSDoc comments, so Node.js will never try to import them but they can be used to define types which are too complicated to define inline or in a JSDoc comment.

There are cases where `@kbn/pm` relies on code from packages, mostly to prevent reimplementing common functionality. This can only be done in one of two ways:

 1. With a dynamic `await import(...)` statement that is always run after boostrap is complete, or is wrapped in a try/catch in case bootstrap didn't complete successfully.
 2. By pulling in the source code of the un-built package.

Option 1 is used in several places, with contingencies in place in case bootstrap failed. Option 2 is used for two pieces of code which are needed in order to run bootstrap:

 1. `@kbn/plugin-discovery` as we need to populate the `@kbn/package-map` to run Bazel
 2. `@kbn/bazel-runner` as we want to have the logic for running bazel in a single location

Because we load these two packages from source, without being built, before bootstrap is ever run, they can not depend on other packages and must be written in Vanilla JS as well.