小编JSO*_*ulo的帖子

我正在尝试将我的 Angular 9 应用程序升级到 Angular 10 版本，但在升级后低于警告

WARNING in calendar.reducer.ts depends on lodash/keys. CommonJS or AMD dependencies can cause optimization bailouts.

我已将以下行添加到我的angular.json文件中，但问题未解决

"allowedCommonJsDependencies": ["lodash"]

我该如何解决上述问题。

我的 NuxtJS 应用程序需要帮助。

最近，在我离开应用程序一段时间（2 个月）而没有更新后，应用程序中出现了 ESLint 冲突。因此，在我开始研究它之后，尝试解决 ESLint 问题提出了挑战。然后我必须将项目迁移到较新版本的 Node 和 ESLint。

这样做之后，我解决了冲突问题，我的项目可以安装我的依赖项，但现在服务器无法启动。节点现在抛出一个错误，我什至不知道如何修复。我不知道许多其他人在升级 Node.js 版本后是否面临这个问题，但它抛出了有关不支持的哈希函数的错误。

这是阻止我的服务器启动的终端错误的屏幕截图：

我已经解决了迁移带来的所有 ESLint 和语法错误，所以我不知道还能做什么。

下面是我的 nuxt.config.js 文件的片段：

export default {
  // Global page headers: https://go.nuxtjs.dev/config-head
  head: {
    title: 'heritage-fd',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: '' },
      { name: 'format-detection', content: 'telephone=no' }
    ],
    
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ],
    
    script: [
      {
        src: '~/static/css/bootstrap.min.js',
      },
    ], …

我正在尝试在组件中使用 mat-chip 。在升级到 Angular 15 之前，我的代码曾经可以运行

我正在导入模块，这似乎是一个常见的错误

我想我已经根据文档包含了所有内容。

非常感谢您的帮助。谢谢

错误是：

Error: src/app/app.component.html:1:1 - error NG8001: 'mat-chip-list' is not a known element:
1. If 'mat-chip-list' is an Angular component, then verify that it is part of this module.
2. If 'mat-chip-list' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

1 <mat-chip-list>
  ~~~~~~~~~~~~~~~

  src/app/app.component.ts:5:16
    5   templateUrl: './app.component.html',
                     ~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component AppComponent.

版本信息是：

Angular CLI: 15.0.0-rc.3
Node: 16.14.0
Package …

在升级到 Angular 11 之前，我通过以下命令运行了代码覆盖率的单元测试：

ng test --project my-app --code-coverage true

当我将我的项目升级到 Angular 11 时，我仍然能够进行我的代码覆盖率测试，但是我开始收到一条消息，说“'karma-coverage-istanbul-reporter' 的使用自版本 11 以来已被弃用”。它要求我安装 karma-coverage 并更新 karma.conf.js。所以我做了它所要求的。我通过以下命令安装了 karma-coverage 和 karma：

npm install karma karma-coverage --save-dev

结果，我在 package.json 中的 devDependencies 下看到了 karma 条目：

ng test --project my-app --code-coverage true

我更新了我的 karma.conf.js 文件。以下是存在的内容，除了我的评论外，一切都和原来一样：

npm install karma karma-coverage --save-dev

进行此更新后，发生了两件事，我不知道为什么。

1. 当我运行正常的代码覆盖率命令时，我收到以下错误：“服务器在端口 9876 上启动失败：错误：必须安装 karma-coverage 才能运行代码覆盖率。” 我确实安装了它，正如我的 package.json 所示，但由于某种原因，我的项目无法识别这一点。此外，如果我将 karma-coverage-istanbul-reporter require 方法添加回我的 conf.js 文件，coverage 工作正常，但我仍然收到该弃用消息。谁能向我解释为什么我可能会收到此错误？

2. 当我在没有覆盖的情况下运行测试时，我现在收到多个以前从未收到过的警告，例如：“无法从文件扩展名确定文件类型，默认为 js。要使警告静音，请指定 C:/Angular/ 的有效类型配置文件中的 my-project/projects/my-app/src/app/app.component.spec.ts。” 我需要做什么来解决这个问题？

编辑：我找到了答案。在coverageReporter 对象中，您需要将fixWebpackSourcePaths 属性添加为true：

"karma": "^5.2.3",<br>
"karma-coverage": "^2.0.3"

我有一个 React JS 应用程序，我在其中使用 axios 发送 GET 请求。在浏览器的Response Headers部分中，当我发送请求时，我得到了Content-Disposition: attachment;filename="image123.pdf"，但是当我尝试在 React 中获取它时，我没有得到任何具有该名称的字段。因此，当我尝试访问 时response.headers['content-disposition']，我什么也得不到。

是否可以使用 React JS 使用 axios 读取此标头键？

在为我的 Angular 项目执行 docker build 时，在npm ci步骤中，出现以下错误： Cannot read property '@angular/animations' of undefined

由于没有正确的错误，我们无法找到解决方案。

包和节点的版本：

• @角度/动画 - 15.2.9
• Node.Js - 18.14.2
• 国家公共管理 - 9.5
• 角度 CLI - 15.2.8

到目前为止我已经尝试过：

• 交叉检查动画模块的 package.json 文件
• 尝试降级@angular/animations版本
• 删除package-lock.json文件和node_module目录
• 删除缓存并尝试过

Docker文件：

FROM docker-images.artifactory.dummydomain.com/db/node:14.18-alpine as build

WORKDIR /usr/src/app
COPY . /usr/src/app
RUN npm install -g @angular/cli@15.2.8
RUN npm ci 
RUN ng build --configuration=test
USER node
COPY --chown=node:node . .

Package.json 文件依赖项：

    "@angular/animations": "^15.2.9",
    "@angular/cdk": "^15.2.9",
    "@angular/common": "^15.2.9",
    "@angular/compiler": "^15.2.9",
    "@angular/core": "^15.2.9",
    "@angular/forms": "^15.2.9",
    "@angular/localize": …

我有干净的（只有 eslint 和 prettier）Angular 16 项目和这个 package.json。我的 IDE 显示错误，屏幕截图位于帖子页脚上。在Angular版本较低的项目中，不存在这个错误。

{
  "name": "my-app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "watch": "ng build --watch --configuration development",
    "test": "ng test",
    "lint": "ng lint"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^16.0.0",
    "@angular/common": "^16.0.0",
    "@angular/compiler": "^16.0.0",
    "@angular/core": "^16.0.0",
    "@angular/forms": "^16.0.0",
    "@angular/platform-browser": "^16.0.0",
    "@angular/platform-browser-dynamic": "^16.0.0",
    "@angular/router": "^16.0.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.13.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^16.0.0",
    "@angular-eslint/builder": "16.0.1",
    "@angular-eslint/eslint-plugin": "16.0.1",
    "@angular-eslint/eslint-plugin-template": "16.0.1",
    "@angular-eslint/schematics": "16.0.1",
    "@angular-eslint/template-parser": "16.0.1",
    "@angular/cli": "~16.0.0", …

我正在尝试基于运行 Azure DevOps Server 2020 的提交消息片段在管道中插入额外的参数。我尝试使用以下代码来实现它，但没有成功：

variables:
  - name: commitMessage
    value: $(Build.SourceVersionMessage)
steps:
  - template: myTemplate.yaml
    parameters:
      ${{ if contains(variables['commitMessage'], 'SPECIAL_MESSAGE') }}:
        specialParam: 'someValue'

在调查过程中，我发现这些表达式的表现有些出乎意料：

variables:
  - name: commitMessage
    value: $(Build.SourceVersionMessage)
steps:
  - bash: | 
      echo "${{ variables['commitMessage'] }}"
      echo "${{ contains(variables['commitMessage'], 'SPECIAL_MESSAGE') }}"
      echo "${{ contains('test SPECIAL_MESSAGE', 'SPECIAL_MESSAGE') }}"

脚本输出是：

test SPECIAL_MESSAGE
False
True

脚本的第一行正确输出提交消息。但是contains()脚本第二行中的函数似乎无法处理该变量，即使提交消息包含 SPECIAL_MESSAGE，表达式也会返回False。

但是，如果我将变量设置为静态字符串而不是$(Build.SourceVersionMessage)变量，则表达式返回True，并且我可以添加额外的参数：

variables:
  - name: commitMessage
    value: 'test SPECIAL_MESSAGE'

知道管道为什么会这样，或者如何让它工作吗？

角度 RouteReuseStrategy 滚动位置错误。

当我从另一个页面返回列表页面时，滚动条回到顶部

import {ActivatedRouteSnapshot, DetachedRouteHandle, RouteReuseStrategy} from '@angular/router';

export class SystemRouteReuseStrategy implements RouteReuseStrategy {

  handlers: {[key: string]: DetachedRouteHandle} = {};

  shouldDetach(route: ActivatedRouteSnapshot): boolean {
    if (route.data.reuse) {
      return true;
    }
    return false;
  }

  store(route: ActivatedRouteSnapshot, handle: DetachedRouteHandle): void {
    this.handlers[route.routeConfig.path] = handle;
  }

  shouldAttach(route: ActivatedRouteSnapshot): boolean {
    return !!route.routeConfig && !!this.handlers[route.routeConfig.path];
  }

  retrieve(route: ActivatedRouteSnapshot): DetachedRouteHandle {
    return this.handlers[route.routeConfig.path]; 
  }

  shouldReuseRoute(future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean {
    return future.routeConfig === curr.routeConfig;
  }

}

我已经从 angular 7.1.4 更新到了 10。现在我收到了这样的奇怪警告：

C:\Sviluppo\Welcome\welcome-cloud-app\src\app\calendario-fasce\mese\mese.component.ts 中的警告取决于 src/app/interfaces/calendar/calendar.component。CommonJS 或 AMD 依赖项可能会导致优化救助。有关更多信息，请参阅：https : //angular.io/guide/build#configuring-commonjs-dependencies

对于像这样的其他警告，我在 angular.json 中添加了相关行，例如：

"allowedCommonJsDependencies": [
    "moment",
    ....
]"

如何解决与我的组件相关的此警告？