Javascript 升级到Angular 10-Fix CommonJS或AMD依赖项可能会导致优化援助

Javascript 升级到Angular 10-Fix CommonJS或AMD依赖项可能会导致优化援助,javascript,angular,rxjs,rxjs6,angular-upgrade,Javascript,Angular,Rxjs,Rxjs6,Angular Upgrade,我正在尝试将angular 9应用程序升级到angular 10版本,但升级后低于警告 rxjs\BehaviorSubject.js depends on rxjs-compat/BehaviorSubject 知道如何解决这个问题吗?建议您避免在应用程序中依赖CommonJS模块。根据CommonJS模块的不同,它可以阻止捆绑程序和小型程序优化您的应用程序,从而导致更大的捆绑包大小。相反,建议您在整个应用程序中使用ECMAScript模块。但您仍然不关心捆绑的大小 要禁用这些警告,可以将C

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

rxjs\BehaviorSubject.js depends on rxjs-compat/BehaviorSubject

知道如何解决这个问题吗?

建议您避免在应用程序中依赖CommonJS模块。根据CommonJS模块的不同,它可以阻止捆绑程序和小型程序优化您的应用程序,从而导致更大的捆绑包大小。相反,建议您在整个应用程序中使用ECMAScript模块。但您仍然不关心捆绑的大小

要禁用这些警告,可以将CommonJS模块名称添加到位于
angular.json
文件的构建选项中的
allowedCommonJsDependencies
选项中

"build": {
  "builder": "@angular-devkit/build-angular:browser",
  "options": {
     "allowedCommonJsDependencies": [
        "rxjs-compat"
     ]
     ...
   }
   ...
},

使用CommonJS打包的依赖项时,可能会导致

从版本10开始,Angular现在会在构建拉入其中一个捆绑包时发出警告。如果您已经开始看到依赖项的这些警告,请让您的依赖项知道您更喜欢ECMAScript模块(ESM)捆绑包

这是一份官方文件-

angular.json文件中查找build对象并添加

允许公共依赖项

如下图所示-

"build": {
  "builder": "@angular-devkit/build-angular:browser",
  "options": {
     "allowedCommonJsDependencies": [
        "rxjs-compat",
         ... few more commonjs dependencies ... 
     ]
     ...
   }
   ...
},

尝试将rxjs导入
rxjs/internal/operators
替换为
rxjs/operators

例:

从'rxjs/internal/operators'导入{catchError,重试};

从'rxjs/operators'导入{catchError,重试};

在我的情况下,它可以工作10.1.0。参考:

对于RXJS库,您可以进行以下更改

对于导入,例如
'rxjs/internal/'
'rxjs/index'
,将其替换为
'rxjs'


对于导入,如
'rxjs/internal/operators'
,将其替换为
'rxjs/operators'
,@Janardhan Burle的回答中提到了这一点。

另一个例子是在构建过程中被警告的问题是在使用以下导入样式时使用
rxjs中的
行为主体

从'rxjs/BehaviorSubject'导入{BehaviorSubject}

它会导致以下错误:

警告:my.service.ts依赖于“rxjs/BehaviorSubject”。CommonJS或 AMD依赖性可能导致优化援助

通过从根模块导入,警告在生成过程中不再出现:

从'rxjs'导入{BehaviorSubject}

在我的情况下(更新到TypeScript版本3.9.7后)
flatMap
已被弃用(来自
rxjs/operators
)。 这是
mergeMap
的别名,所以我刚刚替换了:

从'rxjs/internal/operators'导入{flatMap}


从'rxjs/operators'导入{mergeMap}

只需更改导入:

发件人:

从'rxjs/internal/BehaviorSubject'导入{BehaviorSubject}

致:


从'rxjs'导入{BehaviorSubject}

我有一个包含不推荐的导入“rxjs”的大型项目,并为升级所有不推荐的导入创建此项目

$ python3.6 replace_imports.py PATH_TO_SRC_DIR 
此脚本升级导入类似于
“rxjs\/(内部|可观察|主题| ReplaySubject |订阅|行为Subject)”
到 从rxjs导入{*}



同时尝试升级rxjs compat

你能检查一下你是否曾经不是从rxjs导入,而是从rxjs/behaviorsubject导入。@JonathanStellwag我是这样导入的-
从“rxjs”导入{behaviorsubject}
并且对于Angular 9来说一切都很好。但对于10号角星来说,情况并非如此。对于map操作符,我也面临同样的问题-它说..\node\u modules\rxjs\operators\map.js中的警告取决于rxjs compat/operators/map。CommonJS或AMD依赖可能导致优化援助。这是否回答了您的问题?谢谢你的回答。我仍然想知道是否有任何ECMAScript模块被推荐作为它的替代品?而不是禁用警告。这并没有为我消除警告消息。对我来说也是一样,我使用lodash并将其添加到“allowedCommonJsDependencies”中,但仍然是相同的警告。有什么想法吗?@StackOverflowUser请看看这个答案:虽然建议是正确的,但它假设是我使用CommonJS或AMD,最常见的情况是,我使用的第三方库依赖于这些库。我在/home/leonardo/iq/web iqbot/node_modules/@firebase/app/dist/index.cjs中找不到支持我的案例的关键字:
WARNING依赖于“@firebase/component”。CommonJS或AMD依赖可能导致优化援助。有关更多信息,请参阅:https://angular.io/guide/build#configuring-commonjs依赖项
@LeonardoRick尝试对firebase依赖项使用类似的内容:“allowedCommonJsDependencies”:[“firebase”、“@firebase/app”、“firebase/app”“@firebase/functions”、“@firebase/performance”、“@firebase/remote config”、“@firebase/component”],在您的情况下,只需在现有列表中添加“@firebase/component”关键字,就可以了。@freedev我已经更新了答案中的链接!你可以在这里找到一个很好的解释-干杯!对于在项目根目录中搜索应添加文件的任何人-
angular.json
。@MaximGeorgievskiy优秀新手可能很难找到该文件。。我已经更新了答案,谢谢!它可能会工作,但如果不解释代码,它就没有多大用处。请看下面的答案。用
'rxjs'
替换就可以了,谢谢。这应该可以完成任务。很高兴它能帮上忙。用“rxjs”代替它也帮了我的忙,谢谢这只是补充
$ python3.6 replace_imports.py PATH_TO_SRC_DIR