[@angular-devkit/build-optimizer] causes runtime errors in Monaco Editor #14033
Comments
filipesilva
added
freq1: low
|
Facing the same issue, did anyone figure out how to solve/workaround this? |
|
The scrub file transformer is the one which causes the issue, if that's of any help. Looking at the error I think monaco has it's own dependency injection mechanism based on constructor args. Might be affected by optimization here? |
|
For anyone interested in a workaround, I'm patching the webpack configuration using
module.exports = (webpackConfig, cliConfig) => {
if (cliConfig.buildOptimizer) {
// https://github.com/angular/angular-cli/issues/14033
const loader = webpackConfig.module.rules
.find(rule => rule.use && rule.use
.find(it => it.loader === '@angular-devkit/build-optimizer/webpack-loader'));
const originalTest = loader.test;
loader.test = (file) => {
const isMonaco = !!file.match('node_modules/monaco-editor');
return !isMonaco && !!file.match(originalTest);
};
}
return webpackConfig;
}; |
|
Does this still occur with the latest version of the CLI (currently 8.3.5)? |
|
@clydin The root of the issue is in the I have upgraded the repo demonstrating this bug (https://github.com/petermikitsh/buildoptimizer-error/tree/upgrade-buildoptimizer) to the latest version of the build-optimizer. The bug is still present. |
|
me too! |
|
I had to adjust @fabioscala answer a little bit to get it to work with Angular 8: const webpack = require('webpack');
const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin');
const findLoader = (webpackConfig, regex) => {
return webpackConfig.module.rules
.filter(rule => !!rule.use)
.find(rule => rule.use.find(it => !!it.loader && regex.test(it.loader)));
};
module.exports = (webpackConfig, cliConfig) => {
if (cliConfig.buildOptimizer) {
const loader = findLoader(webpackConfig, /@angular-devkit\/build-optimizer.*\/webpack-loader/);
const originalTest = loader.test;
loader.test = (file) => {
const isMonaco = !!file.match('node_modules/monaco-editor');
return !isMonaco && !!file.match(originalTest);
};
}
webpackConfig.plugins.push(
new MonacoWebpackPlugin()
);
return webpackConfig;
}; |
|
I debugged a little bit this issue out of interest and noticed that the problem lies here: As you can see that all ModelServiceImpl = __decorate(
[__param(0, IConfigurationService), __param(1, ITextResourcePropertiesService)],
ModelServiceImpl
);Basically @filipesilva could you help to resolve this issue? |
|
Our optimization strategy currently depends heavily on Build Optimizer, and one of the things it does is remove that metadata. We're looking at wholly removing build optimizer from app builds but that won't happen in the version 9 timeframe... Until then I think the best workaround really is #14033 (comment). |
|
I had to tweak @maxtacco's tweak to get it working on Windows, due to the backslash path separators: |
|
I can confirm that the issue is still appearing in latest cli 9.1.7 |
This change lowers the potential for code to be errantly removed by the prefix functions and scrub file transformers. Only known safe modules are used with the prefix functions transformer as it can easily remove required module level side effects (as opposed to global level side effects) such as `__decorate` calls. The scrub file transformer will now keep metadata if non-Angular decorators are present. This allows libraries that use that information to continue to function. Closes angular#14033
This change lowers the potential for code to be errantly removed by the prefix functions and scrub file transformers. Only known safe modules are used with the prefix functions transformer as it can easily remove required module level side effects (as opposed to global level side effects) such as `__decorate` calls. The scrub file transformer will now keep metadata if non-Angular decorators are present. This allows libraries that use that information to continue to function. Closes angular#14033
This change lowers the potential for code to be errantly removed by the prefix functions and scrub file transformers. Only known safe modules are used with the prefix functions transformer as it can easily remove required module level side effects (as opposed to global level side effects) such as `__decorate` calls. The scrub file transformer will now keep metadata if non-Angular decorators are present. This allows libraries that use that information to continue to function. Closes angular#14033
This change lowers the potential for code to be errantly removed by the prefix functions and scrub file transformers. Only known safe modules are used with the prefix functions transformer as it can easily remove required module level side effects (as opposed to global level side effects) such as `__decorate` calls. The scrub file transformer will now keep metadata if non-Angular decorators are present. This allows libraries that use that information to continue to function. Closes angular#14033
This change lowers the potential for code to be errantly removed by the prefix functions and scrub file transformers. Only known safe modules are used with the prefix functions transformer as it can easily remove required module level side effects (as opposed to global level side effects) such as `__decorate` calls. The scrub file transformer will now keep metadata if non-Angular decorators are present. This allows libraries that use that information to continue to function. Closes angular#14033
This change lowers the potential for code to be errantly removed by the prefix functions and scrub file transformers. Only known safe modules are used with the prefix functions transformer as it can easily remove required module level side effects (as opposed to global level side effects) such as `__decorate` calls. The scrub file transformer will now keep metadata if non-Angular decorators are present. This allows libraries that use that information to continue to function. Closes angular#14033 Closes angular#18621
This change lowers the potential for code to be errantly removed by the prefix functions and scrub file transformers. Only known safe modules are used with the prefix functions transformer as it can easily remove required module level side effects (as opposed to global level side effects) such as `__decorate` calls. The scrub file transformer will now keep metadata if non-Angular decorators are present. This allows libraries that use that information to continue to function. Closes #14033 Closes #18621
|
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
🐞 Bug report
Command (mark with an
x)Is this a regression?
Yes, the previous version in which this bug was not present was: ....The bug is not present in
0.8.9, but is present in0.9.0-beta.0.Description
Using
0.9.0-beta.0(or later) versions of@angular-devkit/build-optimizerleads to the following runtime exceptions frommonaco-editor:🔬 Minimal Reproduction
https://github.com/petermikitsh/buildoptimizer-error
🔥 Exception or Error
🌍 Your Environment
Anything else relevant?
The text was updated successfully, but these errors were encountered: