Issue
I'm trying to upgrade Angular from 12 to 13, and after doing npx @angular/cli@13 update @angular/core@13 @angular/cli@13
and starting my app, I get the following error:
[error] TypeError: Cannot read properties of undefined (reading 'styles')
at getStylesConfig (/User/my-user/my-app/node_modules/@angular-devkit/build-angular/src/webpack/configs/styles.js:79:49)
at /User/my-user/my-app/node_modules/@angular-devkit/build-angular/src/builders/dev-server/index.js:130:43
at /User/my-user/my-app/node_modules/@angular-devkit/build-angular/src/utils/webpack-browser-config.js:72:16
at generateWebpackConfig (/User/my-user/my-app/node_modules/@angular-devkit/build-angular/src/utils/webpack-browser-config.js:61:40)
at async generateBrowserWebpackConfigFromContext (/User/my-user/my-app/node_modules/@angular-devkit/build-angular/src/utils/webpack-browser-config.js:123:20)
at async generateI18nBrowserWebpackConfigFromContext (/User/my-user/my-app/node_modules/@angular-devkit/build-angular/src/utils/webpack-browser-config.js:70:20)
at async setup (/User/my-user/my-app/node_modules/@angular-devkit/build-angular/src/builders/dev-server/index.js:127:47)
This looks like the culprit:
function getStylesConfig(wco) {
var _a, _b, _c;
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const postcssImports = require('postcss-import');
const postcssPresetEnv = require('postcss-preset-env');
const { root, buildOptions } = wco;
const extraPlugins = [];
extraPlugins.push(new plugins_1.AnyComponentStyleBudgetChecker(buildOptions.budgets));
const cssSourceMap = buildOptions.sourceMap.styles;
Here's the relevant part of my angular.json
:
{
"options": {
"outputPath": "dist",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
{
"input": "src/default-theme.scss",
"inject": false,
"bundleName": "assets/themes/default"
},
{
"input": "src/high-contrast-theme.scss",
"inject": false,
"bundleName": "assets/themes/high-contrast"
}
],
"sourceMap": {
"styles": false,
"scripts": false
}
}
}
I tried to put a breakpoint at the following line in @angular-devkit/build-angular/src/webpack/configs/styles.js
:
const cssSourceMap = buildOptions.sourceMap.styles;`
Apparently sourceMap
is undefined even if it is in my options
. I tried to change the outputPath
in my option
to test123
to make sure that was the section being read, and I can confirm that it was.
Yet, sourceMap
is undefined.
Does anybody know what I might be missing?
Thanks!
Solution
ngx-build-plus
too needs to be upgrade to the matching Angular version (i.e. 13).
Answered By - Salvatore Iovene
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.