The following guide highlights potential migration steps necessary during theia
upgrades discovered when adopting the framework.
Please see the latest version (master
) for the most up-to-date information. Please contribute any issues you experienced when upgrading to a newer version of Theia to this document, even for previous releases.
Prior to v1.31.1
, a resolution might be necessary to work-around a recently discovered critical vulnerability in one of our runtime dependencies socket.io-parser.
For example:
"resolutions": {
"**/socket.io": "^4.5.3",
"**/socket.io-client": "^4.5.3"
}
We no longer enforce usage of the CircularDependencyPlugin
in the generated webpack configuration. This plugin previously informed users of any non-fatal circular dependencies in their JavaScript imports.
Note that Theia adopters can enable the plugin again by manually adding circular-dependency-plugin
as a dev dependency and adding the following snippet to their webpack.config.js
file.
config[0].module.plugins.push(new CircularDependencyPlugin({
exclude: /(node_modules)[\\\\|\/]./,
failOnError: false
}));
The lerna
dev-dependency was upgraded one major versions, to v5.5.4. This removes a few high and severe known vulnerabilities from our development environment. See the PR for more details.
The upgrade was smooth in this repo, but it's possible that Theia developers/extenders, that are potentially using lerna
differently, might need to do some adaptations.
The react
and react-dom
dependencies were upgraded to version 18. Some relevant changes include:
ReactDOM.render
is now deprecated and is replaced bycreateRoot
fromreact-dom/client
- the new API no longer supports render callbacks
- updates in promises, setTimeout, event handlers are automatically batched
- the dependency
react-virtualized
has been removed in favor ofreact-virtuoso
The electron-rebuild
dependency was upgraded which in turn upgraded node-gyp
to v8.4.1
.
This version of node-gyp
does not support Python2 (which is EOL) so Python3 is necessary during the build.
This is a very important change to how Theia sends and receives messages with its backend.
This new Socket.io protocol will try to establish a WebSocket connection whenever possible, but it may also setup HTTP polling. It may even try to connect through HTTP before attempting WebSocket.
Make sure your network configurations support both WebSockets and/or HTTP polling.
This version updates the Monaco code used in Theia to the state of VSCode 1.65.2, and it changes the way that code is consumed from ASM modules loaded and put on the
window.monaco
object to ESM modules built into the bundle using Webpack.
Two kinds of changes may be required to consume Monaco using ESM modules.
- If your application uses its own Webpack config rather than that generated by the @theia/dev-packages, you
will need to update that config to remove the
CopyWebpackPlugin
formerly used to place Monaco code in the build folder and to build a separate entrypoint for theeditor.worker
. See the changes here - If your application uses its own frontend generator, you should modify the code that generates the
index.html
to load thescript
containing the bundle into thebody
element rather than the head. See changes here - References to the
window.monaco
object should be replaced with imports from@theia/monaco-editor-core
. In most cases, simply adding an importimport * as monaco from '@theia/monaco-editor-core'
will suffice. More complex use cases may require imports from specific parts of Monaco. Please see the PR for details, and please post any questions or problems there.
Using ESM modules, it is now possible to follow imports to definitions and to the Monaco source code. This should aid in tracking down issues related to changes in Monaco discussed below.
The Monaco API has changed in significant ways since the last uplift. One of the most significant is the handling of overrides to services instantiated by Monaco.
- The style of service access
monaco.StaticServices.<ServiceName>.get()
is no longer available. Instead, useStaticServices.get(<ServiceIdentifier>)
with a service identifier imported from@theia/monaco-editor-core
. - Any service overrides that should be used for all instantiations in Monaco should be passed to the first call of
StaticServices.initialize
. The first call is used to set the services for all subsequent calls. Overrides passed to subsequent calls toStaticServices.initialize
will be ignored. To change the overrides used, please overrideMonacoFrontendApplicationContribution.initialize
. - Services that should be used for a particular instantiation must be passed to a child of the global
IInstantiationService
. SeeMonacoEditor.getInstantiationWithOverrides
for an example.
Other changes include a number of changes of name from mode
-> language
and changes of interface. Please consult the PR or
the Monaco source code included with @theia/monaco-editor-core
.
Please see the CHANGELOG for details of changes to Theia interfaces.
If you are using TypeScript <= 4.5.5 and you encounter issues when building your Theia application because your compiler fails to parse our type definitions, then you should upgrade to TypeScript >= 4.5.5.
If you are deploying multiple Theia nodes behind a load balancer, you will have to enable sticky-sessions, as it is now required by the new WebSocket implementation using Socket.io protocol.
For more details, see the socket.io documentation about using multiple nodes.
Due to a colors.js issue, a resolution may be necessary for your application in order to workaround the problem:
For example:
"resolutions": {
"**/colors": "<=1.4.0"
}
Electron got updated from 9 to 15, this might involve some modifications in your code based on the new APIs.
See Electron's documentation.
Most notably the electron.remote
API got deprecated and replaced with a @electron/remote
package.
Theia makes use of that package and re-exports it as @theia/core/electron-shared/@electron/remote
.
See @theia/core
re-exports documentation.
Lastly, Electron must now be defined in your application's package.json
under devDependencies
.
theia build
will automatically add the entry and prompt you to re-install your dependencies when out of sync.
The frontend's source map naming changed. If you had something like the following in your debug configurations:
"sourceMapPathOverrides": {
"webpack://@theia/example-electron/*": "${workspaceFolder}/examples/electron/*"
}
You can delete this whole block and replace it by the following:
"webRoot": "${workspaceFolder}/examples/electron"
- Theia was updated to ES2017
-
es5 VS Code extensions and Theia plugins are still supported
-
If you require an es5 codebase you should be able to transpile back to es5 using webpack
-
The following code transpiles back to an es2015 codebase:
config.module.rules.push({ test: /\.js$/, use: { loader: 'babel-loader', options: { presets: [['@babel/preset-env', { targets: { chrome: '58', ie: '11' } }]], } } });
-
Replace the targets with the ones that are needed for your use case
-
Make sure to use
[email protected]
. Theia requiresinversify@^5.0.1
which means that5.1.1
is compatible, but your lockfile might reference an older version.
-
- N/A.
-
keytar
was added as a dependency for the secrets API. and may requirelibsecret
in your particular distribution to be functional:- Debian/Ubuntu:
sudo apt-get install libsecret-1-dev
- Red Hat-based:
sudo yum install libsecret-devel
- Arch Linux:
sudo pacman -S libsecret
- Alpine:
apk add libsecret-dev
- Debian/Ubuntu:
-
It is possible that a
yarn resolution
is necessary forkeytar
to work on older distributions (the fix was added in1.16.0
by downgrading the dependency version):"resolutions": { "**/keytar": "7.6.0", }
-
keytar
usesprebuild-install
to download prebuilt binaries. If you are experiencing issues where some shared libraries are missing from the system it was originally built upon, you can tellprebuild-install
to build the native extension locally by setting the environment variable before performingyarn
:# either: export npm_config_build_from_source=true yarn # or: npm_config_build_from_source=true yarn
-
The version of webpack was upgraded from 4 to 5 and may require additional shims to work properly given an application's particular setup.
-
The
webpack
dependency may need to be updated if there are errors when performing aproduction
build of the application due to a boguswebpack-sources
dependency. The validwebpack
version includes^5.36.2 <5.47.0
. If necessary, you can use ayarn resolution
to fix the issue:"resolutions": { "**/webpack": "5.46.0", }